Foundation4：Joyride 在页面加载时触发 postRideCallback

Posted 2023-05-09

【中文标题】Foundation4：Joyride 在页面加载时触发 postRideCallback

【英文标题】：Foundation4: Joyride firing postRideCallback on page load

【发布时间】：2013-12-12 00:36:18

【问题描述】：

我将 Foundation4 与 Cakephp2.4 结合使用，到目前为止，我对此没有任何问题。无论我做什么，当页面完成加载时，joyRide 的 postRide 回调都会被调用（并且在 Joyride 完成后不会再次调用）。

另外，由于我的目标只是在 Joyride 结束后立即触发 initialize()（自定义函数），作为替代方案，我尝试将事件侦听器绑定到 .joyride-close-tip 类，甚至是 Joyride 中的自定义元素 ID窗格，所有这些都是在页面加载时调用的也。

我已经尝试了很多不同的变体，以至于我无法充分发布我尝试过的所有内容，但这是我当前的代码：

注意事项：1) 我在 noConflict 模式下使用 jQuery，因为这一切都由 CakePhp2.4 控制，因此，$j 前缀而不是 jquery 通常的 $，2) 我无法在这个应用程序中使用 zepto（虽然我不知道为什么；但是，如果我加载它，则没有任何效果）。

我的 html：

<ol class="joyride-list" data-joyride>
    <li data-id="module-name">
        <h4>Welcome!</h4>
        <p>You're about to start the module. But first, we'll make sure you understand the interface.</p>
    </li>
                   <!--- several more <li> pairs ---->
    <li data-button="begin">
        <h4>All Set?</h4>
        <p>Click "Begin" to get started on this module!</p>
    </li>
</ol>

我的 JS：

<script type="text/javascript" src="appname/js/vendor/jquery.js"></script>
<script type="text/javascript" src="appname/js/foundation.min.js"></script>
<script type="text/javascript" src="appname/js/app.js"></script> <!-- custom js functions that reply on jquery and have no collisions with Foundation -->
<script> 
    $j(document).foundation('joyride',
                            'start',
                             postRideCallback: initialize() 
    );
    // have also tried:
    // $j(document).foundation().foundation('joyride','start',postRideCallback: initialize());
</script>

【参考方案1】：

供大家参考，问题是我将一个实际函数交给postRideCallBack，而不是一个函数定义——即。只需将initialize() 包裹在function() initialize(); 中即可解决问题。

【讨论】：

postRideCallback: initialize （没有括号）应该也可以。