jQuery Mobile div 作为链接和后退按钮问题

Question

我正在尝试为自己制作一个简单的应用程序，并尝试使用 jQuery mobile。我创建了 3 个简单的网站：

http://jsfiddle.net/ZweUQ/2/

var clickEvent = 'click'; // 'tap'
// global init handler
$(document).live('pageinit', function() {
    console.log('init');
    $('.clck').bind(clickEvent, function(e) {
        console.log($(this).attr("data-href"));
    $.mobile.changePage('#search_what');
});

我遇到的问题是，第二页上的 div，我想成为可点击/可点击并切换到站点 3。当我点击时，site3 来了，但是当我点击后退按钮时，然后窗口将切换回站点 2 并立即再次切换回站点 3。

在站点 3 上的“什么”div 和后退按钮上单击 2-3 次，这样您就可以看到我想要告诉您的内容。

如何解决这个问题？

Answer 1

这是一个常见的 jQuery 移动问题。这是因为多个事件绑定到同一个元素。每次返回上一页时，都会再次绑定相同的事件。

这个问题有两种解决方案。

1. 在将事件绑定到某个元素之前，请检查同一事件是否尚未绑定。

   例子：

   $('.menu-browse:Event(!' + touchEvent + ')').each(function(){
       $('.menu-browse').bind(touchEvent, function(e) {
   
       });
   });
   

或

1. 每次绑定事件时，先解除绑定。

   例子：

   $(this).unbind();
   $(this).bind(touchEvent, function(e) {
   
   });
   

遗憾的是，对于这个问题没有万无一失的解决方案。

现在看看：

http://jsfiddle.net/Gajotres/ZweUQ/4/