Question

我正在使用jQuery Mobile制作移动应用程序。它进展顺利，但有一个我无法解决的重大问题。

我有一个index.html，有几个页面（data-role = page）。我通过javascript中的点击事件调用这些页面，因为我传递了参数。页面包含从json文件（基于参数）创建的列表视图（实时pagebeforeshow）。例如，在类别页面上，您单击某个类别，它的ID将传递到下一页，该页面在新列表中显示此类别的子类别。

现在奇怪的是，当我单击后退按钮时，或者当我关闭对话框时，打开该页面或该对话框的单击事件会再次自动触发。例如，单击列表中的项目。单击事件会触发弹出对话框。关闭对话框，重新加载列表（上一页），立即再次弹出对话框，好像点击事件再次被触发......非常奇怪。

我不知道。

这是我用来告诉浏览器获取json并显示我需要的事件的示例。

$('#dialog_zin_nl').live('pagebeforeshow', function(event, data) {

*这里包含了必须在此页面上发生的所有代码，例如获取正确的json内容并将其附加到html ...

之后（在'pagebeforeshow'中）我声明我的按钮点击这样的事件

$("#execute_sub_rubriek").on("click", ".selected_zin_nl", function(event){
                    var selected_zin_nl  = $(this).attr('selected-zin-nl');
                    $.mobile.changePage( "#dialog_zin_nl?current_rubriek=" + current_rubriek_id + "&current_sub_rubriek=" + current_sub_rubriek_id + "&current_zin=" + selected_zin_nl + "", { role: "dialog"} );
                  });

如果有人遇到同样的问题或者知道什么是错的。请解释一下。

谢谢！

编辑如果我使用pageinit我没有这个问题。虽然我不能使用pageinit，因为当用户选择其他类别时，必须刷新页面内容。

我的想法：如果页面被后退按钮调用，是否可以调用pageinit，如果页面被另一个按钮调用，则可以调用pagebeforesh？

Answer 1

您在事件on中添加了pagebeforeshow个侦听器，并且当您导航回该页面时pageshow触发，它将添加第二个 { {1}}监听器，这就是你的代码表现奇怪的原因。

您需要将on和pageinit代码分开，仔细考虑pageinit应该只初始化一个页面，每次查看页面时都会调用pageshow，所以如果你有动态内容，你应该刷新你的DOM在那里，但是在pageshow中附加了on个听众，所以它只会发生一次。

这是一个类似问题的链接，它突出了我们如何在jQM网站上清理我们的JS：https://stackoverflow.com/a/9368352/737023 - 如果你以这种方式组织它会更有意义 - 特别是跟踪什么时候火灾和什么时候运行。

jQM在关闭对话框或导航回来时，事件再次被触发

1 个答案: