有没有办法阻止JQuery Mobile的重复事件?
问题描述:
我将一个点击事件附加到我的页面上的图像。有没有办法阻止JQuery Mobile的重复事件?
$('.ui-block-b img').click(function(event) {}
我正在使用jQuery移动固定页脚。
我试图用pagecreate
和pageinit
事件来初始化这个事件。
当我点击页脚中的链接(正在加载Ajax),然后用点击处理程序返回页面时,pagecreate
和pageinit
正在被刷新。这是连接另一个点击事件,所以当我点击图像2事件正在被解雇。
我想知道是否有一个jQuery的移动事件,解决这个??我在文档中错过了什么吗?
我已经解决了这个问题,通过检查附加它之前,如果事件存在,但它似乎像jQuery手机应该有东西来处理这个?我已经做了
var events = $('.ui-block-b img').data('events');
if (typeof events == 'undefined') { // attach handler}
也许jQuery Mobile的已经解决了这个问题,我只是失去了一些东西?
答
你不应该用一个新页面加载JS,因为你知道你遇到的问题是每次创建页面和每次绑定另一个点击事件时JS都在运行。
解决方案是引用您的元素与原生jQM指针$ .mobile.activePage,这是在pageshow事件触发后可用。或者将jQuery on侦听器放在pageinit事件的根页面div(而不是文档)中。
通过使用$('.ui-block-b img').click(function(event) {}
您可能将绑定事件附加到多个页面中的元素(因为jQuery将页面附加到DOM),这就是您正在做的事情。
<script type="text/javascript">
$("div:jqmData(role='page'):last").bind('pageinit', function(){
//your code here - $.mobile.activePage not declared, but you can setup
// "on" events here that handle elements ONLY on this page
//e.g. $(this).on('click', 'img.ui-block-b', function(){});
// this puts a live event listener that only listens for this page
});
$("div:jqmData(role='page'):last").bind('pageshow', function(){
//your code here - $.mobile.activePage works now
});
</script>
现在,当您绑定事件时,您确保只影响当前页面上的元素。
组织,这是一个有点疼痛,所以我已经提出了一个更好的解决办法我给了另一个问题在这里:Jquerymobile - $.mobile.changepage