HTML5: Yenile popstate

Question

ben gibi bir ajax arama-form var ateşlenir sayfa:

url:/arama/

=> Kullanıcı bir düğmeyi bir arama terimi girer ve tıklama

= > arama tamamlandı ve ajax ile sonuçları bir div içinde sayfadaki

'da gösterir: Ama aynı zamanda kullanıcının & URL adresini arkadaşlarına yapıştırmasını ve önceki aramalarda gezinmesini de istiyorum. ? Aramayı tetiklerken tarayıcılar kullanarak

/arama/

için

/arama/q = yourkeyword

gelen addressbar içinde Yani, url değiştirin:

window.history.pushState("", "Search for "+keyword, "/search/?q="+keyword); 

Bu, tarayıcı adres çubuğundaki URL’yi/search /? Q = anahtar kelimelerinize değiştirir ve iyi çalışır.

Şimdi, arka tuşa basıldığında, tarayıcıların adres çubuğu tekrar gösteriliyor/arama /, bu iyi. Ancak sayfa içeriği yeniden yüklenmemiş, yine de/search /? Q = anahtar kelimenizdeki sonuçları gösterir.

yüzden ekledi:

window.addEventListener("popstate", function(e) 
{ location.reload(); 
}); 

bu doğru yolu var mı? FF ve Chrome gibi masaüstü tarayıcılarda iyi çalışır, ancak örneğin iOS'ta, popstate-event,/search/adresindeki ilk arama yükünün üzerine yüklenir ve bu, sayfanın hiç bitmeyen bir şekilde yeniden yüklenmesiyle sonuçlanır.

Bunu yapmanın doğru yolu nedir?

Answer 1

Benim önerim:

window.location.href = window.location.href; 

bunu test etmedim, ama ne istediğini yapacak düşünüyorum.

Answer 2

En basit çözüm, pushState kullandığınızda genel bir değişken ayarlamaktır. Daha sonra, onopsitat işleyicinizde, ayarlanmış olup olmadığını kontrol edin. E.n .:

window.historyInitiated = true; 
window.history.pushState("", "Search for "+keyword, "/search/?q="+keyword); 
... 
window.addEventListener("popstate", function(e) { 
    if (window.historyInitiated) { 
    window.location.reload(); 
    } 
});