Embedded Event Lists code taking up full page

StackOverflow https://stackoverflow.com/questions/15722374

  •  30-03-2022
  •  | 
  •  

题

When I embed the code provided by EventBrite to show the events that I have organized on my site, the page loads normally but then the JavaScript expands to take up the whole page.

How do I stop this from happening? I have put in my organizer ID and API key. Below is the example code provided:

<script type='text/javascript' src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type='text/javascript' src="http://evbdn.eventbrite.com/s3-s3/static/js/platform/Eventbrite.jquery.js"></script>
<script type='text/javascript'>
$(document).ready(function(){
  Eventbrite({'app_key': $APP_KEY}, function(eb){
    eb.organizer_list_events( {'id': 561037966, 'statuses': "live,started"}, function( response ){
      document.write(eb.utils.eventList( response, eb.utils.eventListRow ));
    });
  });
});​
</script>
有帮助吗？

解决方案

This has nothing to do with the Evenbrite javascript API. The layout is determined by the markup and css styling of your page. The eventList method returns HTML, so you can put that into a specific element and style it appropriately. For example:

<head>
  <script>
    $(document).ready(function(){
      Eventbrite({'app_key': $APP_KEY}, function(eb){
        eb.organizer_list_events( {'id': 561037966, 'statuses': "live,started"}, function( response ){
          var event_list_html = eb.utils.eventList( response, eb.utils.eventListRow );
          $("#event-list").html(event_list_html);
        });
      });
    });
  </script>

  <style>
    #event-list {
      width: 400px;
      border: 1px solid black;
    }   
  </style>
</head>

<body>
  <div id="event-list"></div>
</body>
许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top