3

我有一个非常简单的用例。

在页面初始化加载一个html。

 $(document).on('pageinit',function(){
                window.localStorage.setItem("page",'intro_1');                              
                $('#navigation_main').load('html/intro_1.html');

            });

在滑动时只需更改 dom。

 var flag = 0;
              $("body").bind("swipeleft",function(event) {
                flag +=1;                               
                page = window.localStorage.getItem("page"); 
                alert(flag);            
                switch(page){
                    case 'intro_1':                         
                        window.localStorage.setItem("page",'intro_2');
                        $('#navigation_main').load('html/intro_2.html');                        
                        break;  

                    case 'intro_2':
                        window.localStorage.setItem("page",'challenges');
                        $('#navigation_main').load('html/challenges.html');                     
                        break;  

                    case 'challenges':
                        window.localStorage.setItem("page",'risk_areas');
                        $('#navigation_main').load('html/risk_areas.html');                     
                        break;

                    default:
                        window.localStorage.setItem("page",'intro_1');                              
                        $('#navigation_main').load('html/intro_1.html');
                        break;  
                }

            });

现在这个向左滑动被触发了两次，导致后续页面被加载。我怎样才能阻止这个？

4

2 回答 2

3

您可以尝试$("body").one而不是$("body").bind只调用一次。

于 2013-01-15T03:33:24.283 回答
2

我假设您已多次绑定事件，它可以通过几种方式解决。

  1. 使用$(body).unbind(); 在绑定事件之前。Unbind 将删除所有已绑定的事件。不幸的是，这不是一个好的预防措施，因为您不断地绑定/取消绑定，从而导致大量处理开销。

  2. 除了使用事件绑定/取消绑定、live/die 和 on/off 之外，还有另一种方法。不要在再次绑定之前取消绑定，而是使用 jQuery 事件过滤器，它可以用来识别事件是否已经被绑定。不要忘记从下面发布的链接下载它（它不是 jQM 的标准部分）。

    http://www.codenothing.com/archives/2009/event-filter/

    这是我的使用示例：

    $('#carousel div:Event(!click)').each(function(){
    //If click is not bind to #carousel div do something
});

    我正在使用每个，因为我的轮播 div 有很多内部块，但原理是相同的。如果#carousel 内部 div 元素没有点击事件，则添加该事件。在您的情况下，这将防止多个事件绑定。

于 2013-01-15T11:55:42.740 回答