jquery mobile 1.4页面多页面onpagecreate管理以避免双触发器火灾

2024-04-01

有人可以清除多页中事件处理程序的使用吗?文档很好,但不要警告混合使用时可能出现的冲突。

例如,作为一个新手,我注意到如果我将事件处理程序放在这个 html 结构中,我会得到双重触发,该结构来自以下(或此时忽略)文档的逻辑:

<body>
<div data-role="panel" id="panel">...</div>
<div data-role="page" id="page1" data-title="myhomePage">...</div>
<div data-role="page" id="page2" data-title="products">...</div>
<div data-role="page" id="page3" data-title="settings">...</div>
</body>

在 my.js 中使用以下代码,其中所有处理程序都位于全局页面中(如所示并从文档示例中复制)。

$(document).on('pagecreate' ,function(){...event handlers for buttons etc...}); //for the body // ( which is for me actually wrong!!!)
$(document).on('pagecreate', '#page1' ,function(){...}); //for home page
$(document).on('pagecreate', '#page2' ,function(){...}); //for product page

现在,我有一种直觉,通过删除全局 onpagecreate 并标记 page1 内的所有事件处理程序,在尝试和错误中找到了解决方案。

所以现在在 Javascript 中我只有:

$(document).on('pagecreate', '#page1' ,function(){...all my event handlers here...}); 
//for home page

$(document).on('pagecreate', '#page2' ,function(){...generateLists()...}); 
//for the product page

我几天来苦苦挣扎的所有双重事件都消失了。

但仍然不确定我是否走在正确的道路上,因为我错过了文档中的一些真实的例子。

我还对 API 文档方法中的示例有所抱怨。我很难理解大多数例子。它们都基于抽象概念,而不是基于通常在网络应用程序或页面上找到的真实内容,这确实使整个学习过程变得复杂(至少对我来说)。


如果您有始终必须完成的任务,以及其他基于页面类型的任务,您可以这样实现:

$(document).on("pagecreate", "div[data-role=page]", function(event){
    // Every time a page is being created

    if ($(this).attr("id") == "page1") {
        // Only when on #page1
    }
});

$(this)这里是创建事件被触发的页面,所以你可以用它来操作它自己;最好用div[data-role=page]作为选择器仅将处理程序附加到具有data-role=page

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

jquery mobile 1.4页面多页面onpagecreate管理以避免双触发器火灾 的相关文章

随机推荐