Question

所以在Ratchet 2.0.2的GitHub文档中，我发现了以下声明。

包含JavaScript的脚本标签不会在那些页面上执行加载了push.js.如果您想附加事件处理程序其他页面上的元素，文档级事件委托是常见的溶液

有人可以详细说明在<script>加载后如何让自定义Push.js执行吗？

在我的第一页上，我有一个表格视图，其中有几个指向其他页面的链接，其中一个链接指向第二个页面，其上有一个Twitter Feed小部件。

<li class="table-view-cell media">
    <a class="navigate-right" href="Twitter.php" data-transition="slide-in">
        <span class="media-object pull-left icon icon-person"></span>
        <div class="media-body">
            Twitter Feed
        </div>
    </a>
</li>

第二页仅包含twitter Feed小部件代码。当我直接浏览到这个页面（没有被Push.js加载）时，一切都正确加载，但是当它通过Push.js加载时，脚本不会被执行。

有人可以解释一下我需要做什么才能让这个脚本在被Push.js加载后执行吗？我搜索了Google，Stack Exchange和Github \ Ratchet问题，但未能找到如何实现这一目标的好例子。

一种解决方案是将data-ignore="push"添加到链接中，但我想知道如何处理WITH push.js。

<div class="content">
    <a class="twitter-timeline" href="https://twitter.com/XXXX" data-widget-id="XXXX">Tweets by XXX</a>
</div>
<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>

Answer 1

编辑：以下是我最初解决这个问题的方法，这个问题很好，但我提出了一个更好的解决方案，我将其作为this question.的答案

我终于明白了。

在第一页上，您需要执行以下操作...

var checkPage = function(){
    //Only run if twitter-widget exists on page
    if(document.getElementById('twitter-widget')) {
        loadTwitterFeed(document,"script","twitter-wjs");
    }
};

window.addEventListener('push', checkPage);

每次通过推送加载新页面时，

checkPage()都会执行。

Answer 2

刚刚对Ratchet.js进行了更改，使每个页面的单个js更加优雅。（https://github.com/mazong1123/ratchet-pro）

通过使用新的ratchetPro.js，我们可以做到以下几点：

(function () {
    var rachetPageManager = new window.RATCHET.Class.PageManager();
    rachetPageManager.ready(function () {
       // Put your logic here.
    });
})();

在使用Ratchet \ Push.js加载页面后执行自定义脚本

2 个答案: