手機'後'按下後運行javascript

我們有一個移動網站（MVC風格的ASP.NET），其中包括顯示全屏HTML幻燈片。手機'後'按下後運行javascript

爲了顯示這一點，我們在mobileHTMLMovie視圖運行代碼如下所示：

$(function() { 
    $(document).bind('pageinit', function() { 
    $("header").hide(); 
    $(".subHeader").hide(); 
    $(".subHeaderAccent").hide(); 
    $("footer").hide(); 
    $(".ui-content").css("width", "100%").css("height", "100%").css("margin","0").css("background-color", "#000"); 
    }); 
});

我們所看到的問題是，當用戶按下「返回」按鈕（他/她有限的硬件控件，因爲此代碼禁用所有包裝元素，包括我們的HTML移動按鈕）元素保持隱藏狀態。

我一直無法找到一種方法在他們登陸的頁面上運行「反轉」代碼（顯示而不是隱藏，從「.ui-content」中刪除樣式屬性）。他們登陸的頁面在到達時不運行document.ready，電影頁面不運行'onunload'或'onbeforeunload'，而我在網上找到的其他建議（.live（'click'）） '[data-rel = back]'元素）也沒有工作。

有沒有人有任何建議？

來源

2012-12-26 Jeff

號您是SOL – mplungjan

@mplungjan：幾乎沒有 - 我總是可以有建立經常檢查，如果這些是可見的，切換他們回來，如果他們不定時事件。這只是一種駭人聽聞和醜陋的行爲 - 我寧願讓它在着陸時被可靠地解僱。 – Jeff

您可以將節目添加到頁面的結尾嗎？ – mplungjan

您可以嘗試使用歷史記錄對象並綁定到popstate事件嗎？基本上，當顯示幻燈片時，您會推入一個新狀態，然後當用戶按下時，它可能會觸發彈出窗口。

例子：

$(function() { 
    $(document).bind('pageinit', function() { 
     $("header").hide(); 
     $(".subHeader").hide(); 
     $(".subHeaderAccent").hide(); 
     $("footer").hide(); 
     $(".ui-content").css("width", "100%").css("height", "100%").css("margin","0").css("background-color", "#000"); 

     window.history.replaceState("slideshow", "Slideshow", "slideshow"); 
    }); 

    window.addEventListener('onpopstate', function(event) { 
     if (event.state === "slideshow") { 
      //Close the slideshow 
     } 
    } 
});

我不知道流程是什麼樣的頁面，但你既可以使用取決於幻燈片是如何啓動

資源replaceState或pushState

來源

2012-12-29 17:28:51

手機'後'按下後運行javascript

回答

相關問題