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

【问题标题】：Execute custom script after page loaded with Ratchet\Push.js使用 Ratchet\Push.js 加载页面后执行自定义脚本
【发布时间】：2014-04-17 23:24:35
【问题描述】：

所以在Ratchet 2.0.2 的 GitHub 文档中，我找到了以下语句。

包含 JavaScript 的脚本标签不会在以下页面上执行加载了 push.js。如果您想将事件处理程序附加到其他页面上的元素，文档级事件委托是常见的解决方案。

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

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

<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 提要小部件代码。当我直接浏览到这个页面（没有被Push.js加载）时，一切都正确加载，但是当它通过Push.js加载时，脚本没有被执行。

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

一种解决方案是将data-ignore="push" 添加到链接中，但我想知道如何处理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>

【问题讨论】：

标签： javascript ratchet-2 ratchet-bootstrap push.js

【解决方案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() 将在每次通过推送加载新页面时执行。

【讨论】：

【解决方案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.
    });
})();

【讨论】：