jQuery Mobile - $ .mobile.activePage.attr（）在初始化時調用兩次

Question

我試圖在jQuery Mobile初始啓動啓動屏幕後創建一個重定向。 JavaScript代碼，我有：

$(window).on('pageshow', function() { 
     if($.mobile.activePage.attr("id") === "intro"){ 
      setTimeout(function() { 
       console.log($.mobile.activePage.attr("id")); 
       $.mobile.changePage('pages/login.html'); 
      }, 2000); 
     } 
    }); 

出於某種原因，當我打電話的應用程序中的第一次，我得到這個功能兩個電話與console.log($.mobile.activePage.attr("id"));輸出的當前頁面的ID（因爲它應該）第二次撥打後面的頁面的ID。我不知道爲什麼if子句不會評估爲fales並且代碼再次被調用。設置正確的ID在任何時候都不會重複。更令人驚奇的是，演示情況下，我建的作品就好了：http://jsfiddle.net/AT5Fg/

Answer 1

使用您發佈實施，pageshow事件觸發與$.mobile.activePage.attr("id")等於intro兩倍，這意味着兩個火災intro頁面激活。

分析螢火蟲上的事件表明事件的目標在這兩場大火中是不同的。事件的目標顯示註冊事件或其後代的元素。

在第一次火災中，事件的目標是div id = "intro"元素。在第二場火災中，事件的目標是div id = "intro"的ownerDocument（頂層文檔對象）。但在這兩方面，移動活動頁面都是介紹頁面。這就是爲什麼你面臨這個問題。如果使用event.target.id == 'intro'表達式執行檢查，則您在if塊內的代碼將執行一次。

在分析了以上我認爲你可以使用解決此問題：

$(window).on('pageshow', function(event) { 
    if(event.target.id === "intro"){ 
     setTimeout(function() { 
      console.log($.mobile.activePage.attr("id")); 
      $.mobile.changePage('pages/login.html'); 
     }, 2000); 
    } 
}) 

或

$(document).on("pageshow", "#intro", function(event, ui) { 
    setTimeout(function() { 
     console.log($.mobile.activePage.attr("id")); 
     $.mobile.changePage('pages/login.html'); 
    }, 2000); 
});