0

我在使用 jQuery mobile 时遇到了很多问题,我真的很想开枪打自己的脑袋。

我有一个带有此代码的页面:

$(document).on('pageinit ',function(){
$("#phone_number").on("blur", function (event, ui) {


    $.mobile.changePage("<?php echo base_url(); ?>mobile/products_by_phone",  {
     type: "POST",
     data: {phone :  $('#phone_number').val() },
    transition: "flip"} );

});
});

现在该页面具有有效的 html 和 jQuery mobile 标记,其中包含以下代码:

$(document).on('pageinit ',function(){
 alert();
 });

现在,当我更改页面时它可以工作,但是当我再次调用blur事件时,页面更改了两次,然后我再做 4 次,然后 8 次,等等。

并且按下浏览器的后退按钮可以工作,但是当我尝试向前按下时没有任何反应。

笔记:

  • 我认为这可能与模糊有关,并且每次 changePage 发生模糊触发时,我都尝试添加一个按钮并绑定到单击,但同样的事情发生了
  • 我想也许是我绑定到的事实document导致了它,所以我尝试绑定到页面 id,但那根本不起作用(没有任何事件发生,因为没有绑定事件),然后我尝试触发创建事件,但这也没有绑定事件

为什么会这样?

4

3 回答 3

1

您所要做的就是添加您想要将 init 事件绑定到的页面... 假设您想要这个绑定一次,您需要这样做,您只需要更具体。

例子:

$(document).on('pageinit', '#page1', function(e){...});

将 #page1 替换为您的页面 ID。

于 2013-01-02T21:22:30.007 回答
0

我不熟悉 jQuery mobile,但我假设该changePage()函数使用 AJAX 调用加载新页面内容。如果是这种情况,那么现有的事件处理程序将保留,您每次只需添加更多的事件处理程序。

.off()在(重新)绑定之前尝试使用该函数删除事件处理程序。

于 2013-01-02T16:03:59.880 回答
0

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

这个问题有2个解决方案。

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

例子:

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

    });
});

在这里您将找到事件过滤器的完整实现:​​http://www.codenothing.com/archives/2009/event-filter/

或者:

每次绑定事件时,先取消绑定。

例子:

$(document).unbind();
$(document).bind('pageinit', function(e) {

});

或者:

$(document).die();
$(document).live('pageinit', function(e) {

});

或者在你的情况下:

$(document).off(); 
$(document).on('pageinit',function(){
    alert();
});

可悲的是,这个问题没有万无一失的解决方案。

于 2013-01-02T16:08:54.433 回答