Question

我使用jquery插件进行无限滚动，除了需要运行的客户端脚本外，它的工作正常。

我的无限滚动脚本是：

<script type="text/javascript">
    $('.infinite-container').waypoint('infinite', {
      container: 'auto',
      items: '.infinite-item',
      more: '.infinite-more-link',
      offset: 'bottom-in-view',
      loadingClass: 'infinite-loading',
      onBeforePageLoad: $.noop,
      onAfterPageLoad: $.noop
    });
</script>

我认为我需要做的是以某种方式调用我的服务器端脚本：

onAfterPageLoad:

我的关键问题是我的twitter和facebook按钮加载了。所有我能看到的是“twitter”这个词，facebook按钮根本就没有显示出来。但是在初始页面上它们没有问题。

我不知何故需要再次加载：

<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1&appId=***********";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

以及这些：

    <script>
        $(document).ready(function() {
            $('.container').stickem();
        });
    </script>

<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>

我对javascript / jquery很新，所以欢迎任何建议。感谢。

Answer 1

对于Twitter，您需要：

twttr.widgets.load()

请参阅：https://dev.twitter.com/discussions/890

对于Facebook，您需要：

FB.XFBML.parse();

请参阅：https://developers.facebook.com/docs/reference/javascript/FB.XFBML.parse/

这可以在动态渲染按钮下面调用。

onAfterPageLoad用于调用函数，如果使用它，请小心这样调用它：

onAfterPageLoad: functionName

不

onAfterPageLoad: functionName()

然而，对于fb / twitter按钮的问题，我认为最好将代码放在按钮下方。

Answer 2

您通常希望将所有代码放在一个在页面的DOM完成构建后调用的函数中。在jQuery中，您可以使用ready函数执行此操作：

<script type="text/javascript">
    $(document).ready(function() {
        $('.infinite-container').waypoint('infinite', {
            container: 'auto',
            items: '.infinite-item',
            more: '.infinite-more-link',
            offset: 'bottom-in-view',
            loadingClass: 'infinite-loading',
            onBeforePageLoad: $.noop,
            onAfterPageLoad: $.noop
        });
    });
</script>

facebook和twitter已经这样做了，大多数其他库都已经开发供网络上的任何人使用，所以你通常只需要确保自己的脚本在HTML之后才开始使用source已被解析为足以构建初始元素树（“DOMContentLoaed”事件）。

如何在达到并加载无限滚动后重新加载jquery函数

2 个答案: