Question

我为“pagebeforechange”设置了以下监听器（非常类似于jQuery Mobile Documentation自己的代码），并在主页上调用了http://localhost/#product?id=255979

的链接

//Bind Listener for Product Details
$(document).bind( "pagebeforechange", function( e, data ) {
    //Only Run If Site is Initialized
    if( ajaxSite.options.initialized ) {
        if ( typeof data.toPage === "string" ) {
            var u = $.mobile.path.parseUrl( data.toPage ),
                pl = /^#product/;

            if ( u.hash.search(pl) !== -1 ) {
                console.log("showProduct being called.");
                ajaxSite.showProduct( u, data.options );
                e.preventDefault();
            }
        }
    }
});

当我打开JavaScript控制台并点击链接时，我看到以下内容：

showProduct being called.
showProduct being called.

我似乎无法找到任何关于它被调用两次的原因。我看到其他错误，其中vclicks由于边缘单击而被注册两次，但这没有任何意义，因为它依赖于实际的页面更改。

Answer 1

由于您绑定到$（文档）并使用多页面布局

http://jquerymobile.com/demos/1.0/docs/pages/index.html

我认为jQM多次加载文档（只是预感）

转而使用pageId，例如：

$(document).bind( "pagebeforechange", function( e, data ) { ...

到

$('#pageId').bind( "pagebeforechange", function( e, data ) { ...

Answer 2

也许有点晚了，但这是我受过教育的猜测：

任何pagechange事件都会触发两个转换，一个是“forward”（页面转换），另一个是“reverse”（hashchange）。如果你继续前进，hashChange会被阻止，如果你向后，那就是另一种方式。

查看jqm源代码并检查 ignoreNextHashChange 属性。

这负责阻止正向转换的hashChange，否则你会来回走动。

我猜你的函数是两次触发，因为这两个事件都是从changePage和hashChange内部触发的。

如果是这种情况，JQM必须在触发此事件之前阻止hashChange rountine。

Answer 3

它被设计调用两次。 http://api.jquerymobile.com/pagebeforechange/

如果data.toPage设置为字符串，则事件表示导航即将开始。

如果将data.toPage设置为jQuery对象，则该事件表示目标页面已加载。

Answer 4

如果您阅读jquery移动文档https://api.jquerymobile.com/pagebeforechange/，它会说它被调用两次，一旦data.toPage成为新页面的url，第二次data.toPage已经是新页面的jquery对象。

jQuery Mobile“pagebeforechange”被调用两次

4 个答案: