Bir sayfayı jQuery ile nasıl yenileyebilirim?

Bir sayfayı jQuery ile nasıl yenileyebilirim?

Kullanım location.reload():

$('#something').click(function() {
    location.reload();
});

reload()Fonksiyon için ayarlanabilir isteğe bağlı bir parametre alır truesunucunun yerine önbellekten bir yeniden kuvvet için. Parametre varsayılan olarak ayarlanır false, bu nedenle sayfa varsayılan olarak tarayıcının önbelleğinden yeniden yüklenebilir.

Bu, jQuery olmadan da tüm tarayıcılarda çalışmalıdır:

location.reload();

Bir sayfayı JavaScript ile yenilemenin birden fazla sınırsız yolu vardır :

1. location.reload()
2. history.go(0)
3. location.href = location.href
4. location.href = location.pathname
5. location.replace(location.pathname)

6. location.reload(false)

   Belgeyi tekrar web sunucusundan çekmemiz gerekirse (belge içeriğinin dinamik olarak değiştiği yer gibi) argümanı şu şekilde geçiririz true.

Listenin yaratıcı olmasına devam edebilirsiniz:

• window.location = window.location
• window.self.window.self.window.window.location = window.location
• ... ve diğer 534 yol

var methods = [
  "location.reload()",
  "history.go(0)",
  "location.href = location.href",
  "location.href = location.pathname",
  "location.replace(location.pathname)",
  "location.reload(false)"
];

var $body = $("body");
for (var i = 0; i < methods.length; ++i) {
  (function(cMethod) {
    $body.append($("<button>", {
      text: cMethod
    }).on("click", function() {
      eval(cMethod); // don't blame me for using eval
    }));
  })(methods[i]);
}

button {
  background: #2ecc71;
  border: 0;
  color: white;
  font-weight: bold;
  font-family: "Monaco", monospace;
  padding: 10px;
  border-radius: 4px;
  cursor: pointer;
  transition: background-color 0.5s ease;
  margin: 2px;
}
button:hover {
  background: #27ae60;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Sanırım birçok yol işe yarayacak:

• window.location.reload();
• history.go(0);
• window.location.href=window.location.href;

Bir sayfayı jQuery ile yeniden yüklemek için şunları yapın:

$.ajax({
    url: "",
    context: document.body,
    success: function(s,x){
        $(this).html(s);
    }
});

Burada kullandığım yaklaşım Ajax jQuery idi. Chrome 13'te test ettim . Sonra kodu, yeniden yüklemeyi tetikleyecek işleyiciye koydum. URL olduğu ""anlamına gelir bu sayfayı .

Geçerli sayfa bir POST isteği tarafından yüklendiyse,

window.location = window.location.pathname;

onun yerine

window.location.reload();

çünkü window.location.reload()bir POST isteği tarafından yüklenen bir sayfada çağrılırsa onay istenir.

Soru şu olmalı,

JavaScript ile bir sayfayı yenileme

window.location.href = window.location.href; //This is a possibility
window.location.reload(); //Another possiblity
history.go(0); //And another

Seçim için şımarıksın.

Kullanmak isteyebilirsiniz

location.reload(forceGet)

forceGet bir boolean ve isteğe bağlıdır.

Varsayılan, sayfayı önbellekten yeniden yükleyen false değeridir.

Tarayıcıyı, önbellekten de kurtulmak için sayfayı sunucudan almaya zorlamak istiyorsanız bu parametreyi true olarak ayarlayın.

Ya da sadece

location.reload()

önbellekleme ile hızlı ve kolay istiyorsanız.

Önbellekle ilgili farklı davranışlarla üç yaklaşım:

• location.reload(true)

  forcedReloadParametresini uygulayan tarayıcılarda location.reload(), sayfanın ve tüm kaynaklarının (komut dosyaları, stil sayfaları, resimler vb.) Yeni bir kopyasını getirerek yeniden yüklenir. Hizmet etmeyecek herhangi önbellekten kaynaklar - herhangi göndermeden sunucudan taze kopyalarını alır if-modified-sinceveya if-none-matchistekte başlıklarını.

  Mümkün olan yerlerde tarayıcılarda "sabit yeniden yükleme" yapan kullanıcıya eşdeğerdir.

  Not olduğunu geçen trueetmek location.reload()Firefox'ta (bkz desteklenir MDN ) ve Internet Explorer (bkz MSDN ) ama evrensel olarak desteklenen ve bir parçası değildir değil W3 HTML 5 spec , ne W3 taslak HTML 5.1 Spec , ne de WHATWG HTML Yaşam Standardı .

  Google Chrome gibi desteklenmeyen tarayıcılarda olduğu gibi location.reload(true)davranır location.reload().

• location.reload() veya location.reload(false)

  Çoğul sayfası, bir taze getirilirken, HTML sayfasının üzerindeki, ve sahne olmayan önbelleğe alınan kopya RFC 7234 , tarayıcı önbelleğe alıp almadığını (komut gibi) herhangi bir kaynak revalidasyon isteklerini bile olsalar taze RFC 7234 izinler hizmet etmek tarayıcı vardır Onları yeniden doğrulama olmadan.

  Tam olarak, bir location.reload()arama gerçekleştirirken tarayıcının önbelleğini nasıl kullanması gerektiği belirtilmedi veya belirtilmedi; Yukarıdaki davranışı deneylerle belirledim.

  Bu, kullanıcının tarayıcılarındaki "yenile" düğmesine basmasıyla eşdeğerdir.

• location = location(veya locationözelliklerine tahsis edilmesini içeren sonsuz sayıda diğer olası teknikler )

  Yalnızca sayfanın URL'si bir fragid / hashbang içermiyorsa çalışır!

  Refetching veya yeniden valide olmadan Reloads sayfasını herhangi taze önbellekten kaynaklar. Sayfanın HTML'sinin kendisi yeni ise, HTTP isteği gerçekleştirmeden sayfayı yeniden yükler.

  Bu, (önbellek açısından) sayfayı yeni bir sekmede açan kullanıcıya eşdeğerdir.

  Ancak, sayfanın URL'si bir karma içeriyorsa bunun bir etkisi olmaz.

  Yine, burada önbelleğe alma davranışı bildiğim kadarıyla belirtilmemiş; Test ederek belirledim.

Yani, özet olarak, kullanmak istersiniz:

• location = locationsayfanın URL'sinde bir karma olmadığı sürece önbelleğin maksimum kullanımı için , bu durumda çalışmaz
• location.reload(true)yeniden onaylamadan tüm kaynakların yeni kopyalarını almak için (evrensel olarak desteklenmese ve location.reload()Chrome gibi bazı tarayıcılarda farklı davranmayacak olsa da )
• location.reload() 'yenile' düğmesine tıklayarak kullanıcının etkisini tam olarak yeniden oluşturmak için.

window.location.reload() sunucudan yeniden yüklenir ve tüm verileriniz, komut dosyalarınız, resimleriniz vb. tekrar yüklenir.

HTML'yi yenilemek istiyorsanız, window.location = document.URLçok daha hızlı ve daha az trafikle geri döner. Ancak URL'de bir karma (#) varsa sayfayı yeniden yüklemez.

JQuery Loadişlevi sayfa yenileme de gerçekleştirebilir:

$('body').load('views/file.html', function () {
    $(this).fadeIn(5000);
});

Soru genel olduğundan, cevap için olası çözümleri özetlemeye çalışalım:

Basit düz JavaScript Çözümü :

En kolay yol, uygun bir şekilde yerleştirilmiş tek hatlı bir çözümdür:

location.reload();

Burada birçok kişinin eksik olduğu şey, bazı "puanlar" almayı umdukları için, reload () işlevinin kendisinin bir parametre olarak bir Boolean sunmasıdır (ayrıntılar: https://developer.mozilla.org/en-US/docs/Web / API / Konum / yeniden yükleme ).

Location.reload () yöntemi, kaynağı geçerli URL'den yeniden yükler. İsteğe bağlı benzersiz parametresi, doğru olduğunda sayfanın her zaman sunucudan yeniden yüklenmesine neden olan bir Boolean değeridir. Yanlış veya belirtilmemişse, tarayıcı sayfayı önbelleğinden yeniden yükleyebilir.

Bu, iki yol olduğu anlamına gelir:

Çözüm1: Geçerli sayfayı sunucudan yeniden yüklemeye zorlayın

location.reload(true);

Solution2: önbellek veya sunucudan yeniden yüklenmesi (tarayıcı ve config dayanarak)

location.reload(false);
location.reload();

Ve bir olayı dinleyerek jQuery ile birleştirmek istiyorsanız, ".click" veya diğer olay sarmalayıcılar yerine ".on ()" yöntemini kullanmanızı öneririm, örneğin daha uygun bir çözüm:

$('#reloadIt').on('eventXyZ', function() {
    location.reload(true);
});

İşte jQuery kullanarak bir sayfayı eşzamansız olarak yeniden yükleyen bir çözüm. Neden olduğu titreşimi önler window.location = window.location. Bu örnek, gösterge tablosunda olduğu gibi sürekli olarak yeniden yüklenen bir sayfayı göstermektedir. Savaşta test edildi ve Times Meydanı'ndaki bir bilgi ekranı TV'de çalışıyor.

<!DOCTYPE html>
<html lang="en">
  <head>
    ...
    <meta http-equiv="refresh" content="300">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script>
    <script>
    function refresh() {
      $.ajax({
        url: "",
        dataType: "text",
        success: function(html) {
          $('#fu').replaceWith($.parseHTML(html));
          setTimeout(refresh,2000);
        }
      });
    }
    refresh();
    </script>
  </head>
  <body>
    <div id="fu">
      ...
    </div>
  </body>
</html>

Notlar:

• Kullanılması $.ajaxdoğrudan gibi $.get('',function(data){$(document.body).html(data)}) nedenler css / js dosyaları önbellek baskın almak için kullanmak bile cache: truekullandığımız bu yüzden, işte buparseHTML
• parseHTMLbir bodyetiket bulamayacaksınız, bu yüzden tüm vücudunuzun ekstra bir div'a gitmesi gerekiyor, umarım bu bilgi külçesi bir gün size yardımcı olur, bunun için kimliği nasıl seçtiğimizi tahmin edebilirsinizdiv
• Kullanım http-equiv="refresh"sadece durumda bir şey javascript / sunucu hıçkırık ile yanlış giderse, o zaman sayfa HALA telefon görüşmesi almadan yeniden yükleyecektir
• Bu yaklaşım muhtemelen bir şekilde hafızayı sızdırıyor, http-equivyenileme

buldum

window.location.href = "";

veya

window.location.href = null;

ayrıca sayfanın yenilenmesini sağlar.

Bu, karmayı kaldırarak sayfayı yeniden yüklemeyi çok daha kolay hale getirir. İOS simülatöründe AngularJS'yi kullandığımda çok güzel, bu yüzden uygulamayı tekrar çalıştırmak zorunda kalmam.

JavaScript location.reload() yöntemini kullanabilirsiniz . Bu yöntem bir boole parametresini kabul eder. trueveya false. Parametre true; sayfa her zaman sunucudan yeniden yüklenir. Eğer öyleyse false; varsayılan veya boş parametre tarayıcısı ile sayfayı önbelleğinden yeniden yükleyin.

ile trueparametre

<button type="button" onclick="location.reload(true);">Reload page</button>

İle default/ falseparametre

 <button type="button" onclick="location.reload();">Reload page</button>

Jquery kullanma

<button id="Reloadpage">Reload page</button>
<script type="text/javascript">
    $('#Reloadpage').click(function() {
        location.reload();
    }); 
</script>

Sen gerekmez kullanarak bir sayfayı yeniden, jQuery bir şey saf JavaScript sadece bu gibi konum mülkiyet yeniden işlevini kullanın:

window.location.reload();

Varsayılan olarak, bu, tarayıcı önbelleğini (varsa) kullanarak sayfayı yeniden yükler ...

Sayfayı yeniden yüklemeye zorlamak istiyorsanız, aşağıdaki gibi yeniden yükleme yöntemine gerçek bir değer iletmeniz yeterlidir ...

window.location.reload(true);

Ayrıca zaten pencere kapsamındaysanız , pencereden kurtulabilir ve şunları yapabilirsiniz:

location.reload();

kullanım

location.reload();

veya

window.location.reload();

onclick="return location.reload();"Düğme etiketi içinde kullanın .

<button id="refersh-page" name="refersh-page" type="button" onclick="return location.reload();">Refesh Page</button>

JQuery kullanıyorsanız ve yenilemek istiyorsanız, jQuery'nizi bir javascript işlevine eklemeyi deneyin:

Bir tıkladığınızda bir iframe'i bir sayfadan gizlemek istedim h3, benim için işe yaradı, ancak iframetarayıcıyı manuel olarak yenilemediğimde başlamamı sağlayan öğeyi tıklayamadım ... ideal değil.

Aşağıdakileri denedim:

var hide = () => {
    $("#frame").hide();//jQuery
    location.reload(true);//javascript
};

Düz Jane javascript jQuery ile karıştırma çalışması gerekir.

// code where hide (where location.reload was used)function was integrated, below    
    iFrameInsert = () => {
        var file = `Fe1FVoW0Nt4`;
        $("#frame").html(`<iframe width=\"560\" height=\"315\" src=\"https://www.youtube.com/embed/${file}\" frameborder=\"0\" allow=\"autoplay; encrypted-media\" allowfullscreen></iframe><h3>Close Player</h3>`);
        $("h3").enter code hereclick(hide);
}

// View Player 
$("#id-to-be-clicked").click(iFrameInsert);

Buradaki tüm cevaplar iyi. Soru, sayfayı yeniden yüklemeyle ilgili olarak belirtildiğindenjQuery, Gelecekteki okuyucular için daha fazla şey eklemeyi düşündüm.

jQuery ,HTML'nin istemci tarafı kodlamasını basitleştirmek için tasarlanmış birplatformlar arası JavaScript kütüphanesidir .

^{~ Wikipedia ~}

Böylece anlayacaksınız ki jQueryveya jQuery dayanır javaScript. Yani safla gitmekjavaScript basit şeyler söz konusu olduğunda çok daha iyi.

Ama eğer ihtiyacınız varsa jQuery çözüm, işte bir tane.

$(location).attr('href', '');

Geçerli sayfaları yeniden yüklemenin birçok yolu vardır, ancak bir şekilde bu yaklaşımları kullanarak sayfanın güncellendiğini görebilirsiniz, ancak birkaç önbellek değerine sahip olmayacaksınız, bu nedenle bu sorunun üstesinden gelin veya zor talepler yapmak istiyorsanız aşağıdaki kodu kullanın.

    location.reload(true);
    //Here, it will make a hard request or reload the current page and clear the cache as well.


    location.reload(false); OR location.reload();
    //It can be reload the page with cache

<i id="refresh" class="fa fa-refresh" aria-hidden="true"></i>

<script>
$(document).on('click','#refresh',function(){
   location.reload(true);
});
</script>

Basit Javascript Çözümü:

 location = location; 

<button onClick="location = location;">Reload</button>

Muhtemelen en kısa (12 karakter) - kullanım geçmişi

history.go()

İki şekilde yazabilirsiniz. 1, basit yenileme olarak da adlandırılan sayfayı yeniden yüklemenin standart yoludur

location.reload(); //simple refresh

Bir diğerine sert yenileme denir . Burada boole ifadesini iletir ve true olarak ayarlarsınız. Bu, eski önbelleği yok eden ve içeriği sıfırdan görüntüleyen sayfayı yeniden yükleyecektir.

location.reload(true);//hard refresh

JavaScript'te en kısadır.

window.location = '';

$(document).on("click", "#refresh_btn", function(event) 
{
     window.location.replace(window.location.href);
});

İşte jQuery kullanarak sayfayı yeniden yüklemek için kullanabileceğiniz bazı kod satırları .

JQuery sarmalayıcısını kullanır ve yerel dom öğesini ayıklar.

Kodunuzda bir jQuery hissi istiyorsanız ve kodun hızını / performansını önemsemiyorsanız bunu kullanın .

İhtiyaçlarınıza uygun 1'den 10'a kadar seçim yapın veya bundan önceki desene ve cevaplara göre biraz daha ekleyin.

<script>
  $(location)[0].reload(); //1
  $(location).get(0).reload(); //2
  $(window)[0].location.reload(); //3
  $(window).get(0).location.reload(); //4
  $(window)[0].$(location)[0].reload(); //5
  $(window).get(0).$(location)[0].reload(); //6
  $(window)[0].$(location).get(0).reload(); //7
  $(window).get(0).$(location).get(0).reload(); //8
  $(location)[0].href = ''; //9
  $(location).get(0).href = ''; //10
  //... and many other more just follow the pattern.
</script>