6

我有一个 Phonegap 和 jQuery Mobile 应用程序，可以很好地在 Android 和 Web 上运行。在 iOS 上，我得到了意想不到的结果，这似乎是由于我将大多数应用程序进程的处理程序绑定到的 document.pageinit 事件被触发了两次。

不，我没有绑定两次。不，我没有使用 document.ready。是的，我确实将它绑定到文档，在脚本的早期而不是在任何其他函数中。

$(document).on('pageinit',function(event){
    alert(' Pageinit on document');
    //Some more code
})

第一次触发时，启动画面仍然显示。此时，在使用 XCode 的 MacBook Pro 上进行测试时，控制台甚至不可用：当我使用 console.log 时，上面的消息没有出现在控制台中。

第二次，在 jQueryMobile 创建第一页后不久触发。

是什么导致了这种双重射击，我该怎么办？

编辑：我后来注意到 pageinit 不只是第二次触发，而是每次我打开一个新的 data-role='page' div 时。请看下面我的回答。

4

4 回答 4

15

我很欣赏 Zoltans 的回答，在某些情况下它可能是相关的，但这不是原因。

$(document).on('pageinit')将为您的 jQuery Mobile 应用程序中使用的每个页面转换触发。这将发生在 HTML 链接和使用$.mobile.changePage();.

令人震惊的是，文档在任何地方都没有提到这一点：他们建议您使用它，但没有提到它会为每个后续页面触发。

我无法相信他们将这个有问题的示例构建为$(document).ready().

他们应该建议您使用 .one() 而不是 .bind() 或 on() 进行绑定，以避免多次代码执行。

于 2012-09-26T15:46:58.007 回答
2

发生这种情况是因为我认为您将 jquery 和 jquery mobile 一起使用。但解决方案很简单。尝试

$(document:not(.processed)).addClass('processed').on('pageinit',function(event)

这应该解决它

于 2012-09-26T09:15:47.930 回答
2

编辑正文<body data-role="page">应该可以解决问题。

于 2012-10-20T16:22:56.910 回答
0

我在这个问题上苦苦挣扎太久，无法与他人分享。而且我认为这不仅是 iOS 下的问题，而且是 Android 下的问题（在我的情况下它会导致闪烁）。

每次发出请求时都会调用两次“pageinit”事件。第一个是为提供的 url 获取数据的正确方法，另一个是在新页面加载到 DOM 后调用的（jQueryMobile 页面动态注入到文档中）。我认为有更多的解决方案可以解决这个问题，这里是我的：

$(document).ready(function(){
    $(this).delegate("#page-selector", "pageinit", function(ev, data){}); 
    // I don't know why the line has to be present, but otherwise does not work
});

我的 HTML 文档如下所示：

<html>
<head>...here goes scripts...</head>
<body>
   <div id="#page-selector"> <!-- just wrapper -->
       <div data-role="page">
        ... content...
       </div>
   </div>
</body>
</html>

我希望它能为别人腾出宝贵的时间！

于 2012-11-07T23:04:21.067 回答