Chạy javascript sau khi di động 'quay lại' báo chí

Question

Chúng tôi có một trang web di động (ASP.NET theo kiểu MVC), trong số những thứ khác, hiển thị trình chiếu HTML toàn màn hình.

Để hiển thị này, chúng tôi chạy mã trên quan điểm mobileHTMLMovie như vậy:

$(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"); 
    }); 
}); 

Vấn đề chúng ta đang thấy là khi người dùng đẩy nút 'trở lại' (s/anh ta giới hạn ở những phần cứng kiểm soát, như mã này vô hiệu hóa tất cả các yếu tố bao bọc, bao gồm các nút chuyển động HTML của chúng tôi) các yếu tố vẫn còn ẩn.

Tôi không thể tìm cách chạy mã 'đảo ngược' (hiển thị thay vì ẩn, loại bỏ thuộc tính kiểu từ ".ui-content") trên trang mà chúng truy cập. Trang họ truy cập không chạy document.ready khi họ đến, trang phim không chạy 'onunload' hoặc 'onbeforeunload' và đề xuất khác tôi đã tìm thấy trực tuyến (.live ('click') trên '[data-rel = back]' element) cũng không hoạt động.

Có ai có bất kỳ đề xuất nào không?

Answer 1

Bạn có thể thử sử dụng đối tượng Lịch sử và liên kết với sự kiện popstate không? Về cơ bản, khi trình chiếu được hiển thị, bạn sẽ đẩy một trạng thái mới vào và sau đó khi người dùng nhấn lại, nó có thể kích hoạt cửa sổ bật lên.

Ví dụ:

$(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 
     } 
    } 
}); 

Tôi không chắc chắn những gì các dòng chảy là cho trang, nhưng bạn có muốn sử dụng replaceState hoặc pushState tùy thuộc vào cách trình chiếu được đưa ra

Tài

• https://developer.mozilla.org/en-US/docs/DOM/window.history
• https://developer.mozilla.org/en-US/docs/DOM/Manipulating_the_browser_history