Nút quay lại Mobile Safari

Question

Vấn đề tôi tìm thấy rất giống với this question, ngoại trừ Safari trên máy tính để bàn dường như đã giải quyết được sự cố. Về cơ bản, vấn đề là: khi một khách hàng đang duyệt trên safari di động và trang thực hiện một hàm javascript trên pagea.html, sau đó điều hướng đến pageb.html, sau đó nhấn nút quay lại để quay lại pagea.html, hàm javascript sẽ không chạy khi khách hàng nhấn nút quay lại để quay lại pagea.html. Nó sẽ bỏ qua cuộc gọi javascript.

Tôi đã thử các giải pháp được đề cập trong liên kết ở trên, nhưng dường như không có gì hoạt động đối với Safari trên thiết bị di động. Có ai khác đã gặp phải lỗi này không? Làm thế nào bạn có thể xoay xở được?

Answer 1

Điều này là do back-forward cache. Nó được cho là để lưu trạng thái đầy đủ của trang khi người dùng điều hướng đi. Khi người dùng điều hướng trở lại với trang nút quay lại có thể được tải từ bộ nhớ cache rất nhanh. Điều này khác với bộ nhớ cache thông thường chỉ lưu trữ mã HTML.

Khi trang được tải cho bfcache onload sự kiện sẽ không được kích hoạt. Thay vào đó, bạn có thể kiểm tra thuộc tính persisted của sự kiện onpageshow. Nó được đặt thành false khi tải trang ban đầu. Khi trang được tải từ bfcache nó được đặt thành true.

window.onpageshow = function(event) { 
    if (event.persisted) { 
     alert("From back/forward cache."); 
    } 
}; 

Vì một lý do nào đó jQuery không có thuộc tính này trong sự kiện. Bạn có thể tìm thấy nó từ sự kiện ban đầu.

$(window).bind("pageshow", function(event) { 
    if (event.originalEvent.persisted) { 
     alert("From back/forward cache."); 
    } 
}); 

Giải pháp nhanh cho vấn đề này là tải lại trang khi nhấn nút quay lại. Điều này tuy nhiên vô hiệu hóa bất kỳ hiệu ứng tích cực trở lại/chuyển tiếp bộ nhớ cache sẽ cung cấp cho.

window.onpageshow = function(event) { 
    if (event.persisted) { 
     window.location.reload() 
    } 
}; 

Là một sidenote, bạn có thể thấy nhiều trang cung cấp sử dụng trống onunload handler làm giải pháp. Điều này đã không hoạt động kể từ iOS5.

$(window).bind("unload", function() { });