pageinit和pageshow之間的區別

我使用jQuery Mobile 1.2創建了一個簡單的webapp。此應用程序由主頁面index.html和名爲settings.html的第二頁面組成。主要頁面包含頭部段打開設置頁面的按鈕：pageinit和pageshow之間的區別

<div data-role="header"> 
    <h1>Main</h1> 
    <a href="settings.html">Settings</a> 
</div><!-- /header -->

在設置對話框中，用戶應該能夠更改程序選項。爲了這個目的，我實現了一個函數來設置每個打開的對話框時的當前選擇：

$(document).on("pageinit", "#page-settings", function() { 
    // numeric text field to change the year of date (settings is an array) 
    $("#text-year").val(settings.year); 
    ... 
});

這工作正確爲止。

現在我看到有更多的事件，如「pagebeforeshow」和「pageshow」。但我不明白這些事件之間的區別。我測試的觸發如下：

$(document).on("pageinit", "#page-settings", function() { 
    alert("pageinit"); 
}); 
$(document).on("pagebeforeshow", "#page-settings", function() { 
    alert("pagebeforeshow"); 
}); 
$(document).on("pageshow", "#page-settings", function() { 
    alert("pageshow"); 
});

如果我點擊按鈕的主頁上，然後所有三個事件會觸發所有警報將顯示。那麼爲什麼有不同的事件呢？我應該在我的設置場景中使用哪一個？

我認爲這個過程如下：我第一次進入我的索引頁面時，該頁面上的所有元素都被添加到DOM，然後事件pageinit和頁面顯示索引被觸發。然後，我點擊鏈接並切換到設置頁面，設置頁面的所有元素都被添加到DOM，事件pageinit和頁面顯示設置被觸發。目前爲止沒關係。然後我回到索引頁面。由於索引元素仍然在DOM中，只有pageshow事件正在觸發。然後我再次點擊設置鏈接。設置元素也應該在DOM中，所以只有pageshow應該再次觸發。但問題是，每次更改頁面時都會觸發所有事件。所以問題是：爲什麼會有不同的事件？我應該在哪裏放置文本框的填充或按鈕點擊的觸發器？

來源

2013-03-20 altralaser

DOM準備就緒時會觸發「pageinit」。當你想在你的頁面下載時初始化變量的時候，這個是有用的。
「pagebeforeshow」在您的頁面顯示之前觸發。當您需要在顯示之前執行操作時，您可以使用此事件，例如添加div或HTML結構。
顯示頁面時會觸發「pageshow」。我使用這個事件來添加我的點擊事件和其他事件。

您可以找到有關文檔中的事件的更多信息： http://api.jquerymobile.com/category/events/

來源

2013-03-20 21:48:56 Xanatos

OK，我理解的差異。 – altralaser 2013-03-21 21:26:23

pageinit和pageshow之間的區別

回答

相關問題