2012-02-27 104 views
1

我正在爲應用程序使用JQuery Mobile。雖然它是一個很好的框架,但我還是有一些細微的差別。目前,我有一個兩頁的應用程序。當用戶導航到第二頁時,我會與Web服務進行交互。如果Web服務返回成功,我加載第二頁。如果Web服務返回失敗的消息,我想用提示向他們顯示一個對話框。要做到這一點,我目前做如下:JQuery Mobile - 與對話框交互

my.js

$("#page2").live("pageshow", function() { 
    var isGood = getResult(); 
    if (isGood == false) { 
    $.mobile.changePage("/myDialog", { role: "dialog" }); 
    } 
    else { 
    // Continue loading page2 related information 
    } 
}); 

目前,這個邏輯作品幾乎是我需要的。該對話框出現。但是,當我關閉它時,「page2」的「pageshow」事件再次觸發。因此,再次加載對話框。基本上,我有一個無限循環。我不知道如何解決這個問題。它幾乎就像一個對話框完全獨立加載到DOM中,而不是與頁面相關。因此,我不確定如何響應對話事件或與它進行交互。我如何解決這個問題?

謝謝

回答

0

我不知道這是否是做到這一點的最好辦法,但它應該工作:

var dialogShown = false; 

$("#page2").live("pageshow", function() { 
    if(dialogShown) 
    return; 
    var isGood = getResult(); 
    if (isGood == false) { 
    $.mobile.changePage("/myDialog", { role: "dialog" }); 
    dialogShown = true; 
    } 
    else { 
    // Continue loading page2 related information 
    } 
}); 
0

我做的非常類似的東西,除了我確認一個用戶已通過身份驗證對話框。下面的代碼塊是我處理這種操作方式的關鍵所在:

(function(){ 
    // Bind to jQM's page change event 
    $(document).on('pagebeforechange', function(e, data) { 
    var loadPage = function(){}; 

    if (typeof data.toPage !== "string") { 
     // Continue with normal jQM operation 
     return; 
    } 

    if (data.toPage.match(/skipCheck=1/)) { 
     // We have already performed all of our checks. 
     // Send the user on to the desired location. 
     return; 
    } 

    loadPage = function() { 
     // The user seems to be authorized right now so let's 
     // send him on to his desired location. 
     $.mobile.changePage(data.toPage + "?skipCheck=1", data.options); 
    }; 

    if (data.toPage.match(/securedPage/)) { 
     e.preventDefault(); // Stop the page load until we know more 
     MYAPP.addEvent('isLoggedInComplete', loadPage); 

     // This is where you would do something in lieu of the 
     // the actual page change event. 
    } 
    }); 
}()); 

請注意,我有自己的目標,MYAPP,它有自己的事件系統。我使用該對象的事件系統來啓動加載我的第二頁。

這個問題的關鍵以及您的問題的答案是檢查'skipCheck'查詢參數。這個參數是我目前用來確定頁面加載事件是否應該被允許像平常一樣完成,或者如果我應該攔截它並做其他事情。

另一個注意:這段代碼來自一個很早開發的應用程序。當我在這個應用程序上工作時,我是一個學習jQM。因此,這可能不是解決問題的最佳方式。