Question

当我嵌入EventBrite提供的代码以显示我在我的网站上组织的事件时，页面会正常加载，但随后JavaScript会扩展以占用整个页面。

如何阻止这种情况发生？我已经输入了我的管理器ID和API密钥。以下是提供的示例代码：

<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>

Answer 1

这与Evenbrite javascript API无关。布局由页面的标记和CSS样式决定。 eventList方法返回HTML，因此您可以将其放入特定元素并对其进行适当的样式设置。例如：

<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>

嵌入式事件列出占用整页的代码

1 个答案: