在启动时仅显示一次 jquery 移动对话框（网络应用程序）答案

【问题标题】：Show jquery mobile dialog only once on startup (web app)在启动时仅显示一次 jquery 移动对话框（网络应用程序）
【发布时间】：2013-06-10 19:57:59
【问题描述】：

我的问题是以下代码工作正常（对话框在启动时显示一次），但是当我导航到另一个页面（激活标准 ajax），然后导航回第一页时，对话框再次显示（然后当我点击“关闭”时以循环方式）。

我做错了什么？

代码如下：

$(document).on('pageinit', '#pageindex', function(event) {
        setTimeout(function(){
            $('#dialog').click();
            $('#dialog').remove();
        },1000);
});

【问题讨论】：

pageinit 只触发一次。您使用的是多 html 文件还是单页？尝试将.on 替换为.one。
我使用多html文件。必须多测试一点，但似乎它适用于one，非常酷。您可以将您的评论作为答案，所以我可以接受。

标签： javascript jquery jquery-mobile web-applications

【解决方案1】：

如需快速修复，请将.on 替换为.one。但是，通常pageinit 事件应该只触发一次，所以肯定是有什么东西导致它触发了多次。

【讨论】：

当使用多 HTML 模板（多页）时，第一页总是缓存在 DOM 中。但是除了第一页之外的页面在你离开它们之后会被加载并从 DOM 中清除。这就是 pageinit 被多次触发的原因。这是正常行为。
当导航回到调用对话框的主页时会发生这种情况。此外，该事件附加到#pageindex，因此它仅针对该特定页面触发。它不会出现在其他页面中。 @TolisEmmanouilidis
我的意思是他必须在导航到下一页时检查#pageindex 页面是否保留在DOM 中。在多个 HTML 模板中，页面（除了第一页）在离开后被加载并从 DOM 中清除。在这种情况下，页面被删除并重新添加到 DOM 中，pageinit 事件将再次触发。
@TolisEmmanouilidis 是的，你是对的。这也取决于 JS 代码的放置位置，是在第一页内还是在外部 JS 文件中。

【解决方案2】：

以下代码在单页/多页和多页方法上执行一次：

$(document).on('pageinit', '#pageindex', function (event) {
    $(this).off(event);
    setTimeout(function () {
        $('#dialog').click();
        $('#dialog').remove();
    }, 1000);
});

【讨论】：