Hoe kan ik een pagina vernieuwen met jQuery?

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>

Antwoord 3, autoriteit 12%

Dit zou in alle browsers moeten werken, zelfs zonder jQuery:

location.reload();

Antwoord 4, autoriteit 5%

Veel manieren zullen werken, denk ik:

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

Antwoord 5, autoriteit 3%

Als u een pagina opnieuw wilt laden met jQuery, doet u het volgende:

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

De aanpak die ik hier gebruikte was Ajax jQuery. Ik heb het getest op Chrome 13. Vervolgens heb ik de code in de handler geplaatst die het opnieuw laden zal activeren. De URL is "", wat deze pagina.

Antwoord 6, autoriteit 3%

Als de huidige pagina is geladen door een POST-verzoek, kunt u gebruik maken van

window.location = window.location.pathname;

in plaats van

window.location.reload();

omdat window.location.reload() om bevestiging zal vragen als deze wordt aangeroepen op een pagina die is geladen door een POST-verzoek.

Antwoord 7, autoriteit 2%

De vraag zou moeten zijn:

Een pagina vernieuwen met JavaScript

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

Je hebt keuze te over.

Antwoord 8

Misschien wilt u

location.reload(forceGet)

forceGet is een boolean en optioneel.

De standaardwaarde is false, waardoor de pagina opnieuw wordt geladen vanuit de cache.

Stel deze parameter in op true als u de browser wilt dwingen de pagina van de server te halen om ook de cache te verwijderen.

Of gewoon

location.reload()

als je snel en gemakkelijk wilt met caching.

Antwoord 9

Drie benaderingen met verschillend cache-gerelateerd gedrag:

• location.reload(true)

  In browsers die de parameter forcedReload van location.reload() implementeren, wordt opnieuw geladen door een nieuwe kopie van de pagina en al zijn bronnen (scripts, stylesheets, afbeeldingen, enz.). Levert geen alle bronnen uit de cache – krijgt nieuwe kopieën van de server zonder if-modified-since of if-none-match te verzenden headers in het verzoek.

  Equivalent aan de gebruiker die een “hard reload” uitvoert in browsers waar dat mogelijk is.

  Merk op dat het doorgeven van true aan location.reload() wordt ondersteund in Firefox (zie MDN) en Internet Explorer (zie MSDN), maar wordt niet universeel ondersteund en maakt geen deel uit van de W3 HTML 5-specificatie, noch de W3 concept HTML 5.1-specificatie, noch de WHATWG HTML Living Standard.

  In niet-ondersteunde browsers, zoals Google Chrome, gedraagt ​​location.reload(true) zich hetzelfde als location.reload().

• location.reload() of location.reload(false)

  Laadt de pagina opnieuw, haalt een nieuwe, niet-gecachete kopie van de pagina-HTML zelf op en voert RFC uit 7234 hervalidatieverzoeken voor bronnen (zoals scripts) die de browser in de cache heeft opgeslagen, zelfs als ze vers zijn RFC 7234 staat de browser toe om ze weer te geven zonder hervalidatie.

  Precies hoe de browser zijn cache moet gebruiken bij het uitvoeren van een location.reload()-aanroep is voor zover ik weet niet gespecificeerd of gedocumenteerd; Ik heb het bovenstaande gedrag bepaald door te experimenteren.

  Dit komt overeen met de gebruiker die simpelweg op de knop “vernieuwen” in zijn browser drukt.

• location = location (of oneindig veel andere mogelijke technieken die betrekking hebben op het toewijzen aan location of naar zijn eigenschappen)

  Werkt alleen als de URL van de pagina geen fragide/hashbang bevat!

  Laadt de pagina opnieuw zonder elke vers bronnen uit de cache. Als de HTML van de pagina zelf vers is, wordt de pagina opnieuw geladen zonder enige HTTP-verzoeken uit te voeren.

  Dit is equivalent (vanuit cachingperspectief) als de gebruiker die de pagina opent in een nieuw tabblad.

  Als de URL van de pagina echter een hash bevat, heeft dit geen effect.

  Nogmaals, het caching-gedrag hier is niet gespecificeerd voor zover ik weet; Ik heb het vastgesteld door te testen.

Dus samengevat wil je het volgende gebruiken:

• location = location voor maximaal gebruik van de cache, zolang de pagina geen hash in de URL heeft, in dat geval werkt dit niet
• location.reload(true) om nieuwe kopieën van alle bronnen op te halen zonder opnieuw te valideren (hoewel het niet universeel wordt ondersteund en zich niet anders gedraagt ​​dan location.reload() in sommige browsers, zoals Chrome)
• location.reload() om het effect van het klikken op de ‘refresh’-knop van de gebruiker natuurgetrouw te reproduceren.

Antwoord 10

window.location.reload() wordt opnieuw geladen vanaf de server en laadt al uw gegevens, scripts, afbeeldingen, enz. opnieuw.

Dus als je alleen de HTML wilt vernieuwen, zal de window.location = document.URL veel sneller en met minder verkeer terugkeren. Maar het zal de pagina niet herladen als er een hash (#) in de URL staat.

Antwoord 11

De jQuery Load-functie kan ook een paginavernieuwing uitvoeren:

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

Antwoord 12

Omdat de vraag generiek is, proberen we mogelijke oplossingen voor het antwoord samen te vatten:

Eenvoudige, eenvoudige JavaScript-oplossing:

De gemakkelijkste manier is een éénregelige oplossing die op de juiste manier wordt geplaatst:

location.reload();

Wat veel mensen hier missen, omdat ze hopen wat “punten” te krijgen, is dat de functie reload() zelf een Boolean als parameter aanbiedt (details: https://developer.mozilla.org/en-US/docs/Web/API/Location/reload).

De methode Location.reload() laadt de bron opnieuw vanaf de huidige
URL. De optionele unieke parameter is een Boolean, die, wanneer het is
true, zorgt ervoor dat de pagina altijd opnieuw wordt geladen vanaf de server. Als het is
false of niet gespecificeerd, kan de browser de pagina opnieuw laden vanaf zijn
cache.

Dit betekent dat er twee manieren zijn:

Oplossing1: Gedwongen herladen van de huidige pagina vanaf de server

location.reload(true);

Oplossing2: Opnieuw laden vanuit cache of server (gebaseerd op browser en uw configuratie)

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

En als je het wilt combineren met jQuery en naar een evenement wilt luisteren, raad ik aan om de “.on()”-methode te gebruiken in plaats van “.click” of andere event-wrappers, b.v. een meer gepaste oplossing zou zijn:

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

Antwoord 13

Hier is een oplossing die een pagina asynchroon herlaadt met jQuery. Het vermijdt het flikkeren dat wordt veroorzaakt door window.location = window.location. Dit voorbeeld toont een pagina die continu herlaadt, zoals in een dashboard. Het is beproefd en draait op een informatie-tv op Times Square.

<!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>

Opmerkingen:

• $.ajax rechtstreeks gebruiken zoals $.get('',function(data){$(document.body).html(data)}) zorgt ervoor dat css/js-bestanden cache-busted worden, zelfs als u gebruik cache: true, daarom gebruiken we parseHTML
• parseHTML vindt GEEN body tag dus je hele lichaam moet in een extra div, ik hoop dat dit stukje kennis je op een dag helpt, je kunt raden hoe we de id voor die div
• Gebruik http-equiv="refresh" voor het geval er iets misgaat met javascript/server hik, dan zal de pagina NOG STEEDS herladen zonder dat je een telefoontje krijgt
• Deze aanpak lekt waarschijnlijk op de een of andere manier geheugen, de http-equiv verversingscorrecties dat

Antwoord 14

Ik heb gevonden

window.location.href = "";

of

window.location.href = null;

vernieuwt ook een pagina.

Dit maakt het veel gemakkelijker om de pagina opnieuw te laden en eventuele hash te verwijderen.
Dit is erg prettig als ik AngularJS gebruik in de iOS-simulator, zodat ik de app niet opnieuw hoef te starten.

Antwoord 15

Je kunt de JavaScript location.reload() methode gebruiken.
Deze methode accepteert een booleaanse parameter. true of false. Als de parameter true is; de pagina wordt altijd opnieuw geladen vanaf de server. Als het false is; wat de standaard is of met een lege parameter browser laadt de pagina opnieuw vanuit de cache.

Met true parameter

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

Met default/ false parameter

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

JQuery gebruiken

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

Antwoord 16

Je hebt niets nodig iets van jQuery om een ​​pagina opnieuw te laden met pure JavaScript, gebruik gewoon de herlaadfunctie op locatie-eigenschap zoals deze:

window.location.reload();

Standaard wordt de pagina opnieuw geladen met behulp van de browsercache (indien aanwezig)…

Als je de pagina geforceerd opnieuw wilt laden, geef dan een true waarde door om de methode opnieuw te laden, zoals hieronder…

window.location.reload(true);

Ook als je al in window scope zit, kun je window verwijderen en het volgende doen:

location.reload();

Antwoord 17

gebruik

location.reload();

of

window.location.reload();

Antwoord 18

Gebruik onclick="return location.reload();" in de button-tag.

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

Antwoord 19

Als u jQuery gebruikt en wilt vernieuwen, probeer dan uw jQuery toe te voegen in een javascript-functie:

Ik wilde een iframe van een pagina verbergen toen ik op oh an h3 klikte, bij mij werkte het, maar ik kon niet op het item klikken waarmee ik het iframe om mee te beginnen, tenzij ik de browser handmatig ververs…niet ideaal.

Ik heb het volgende geprobeerd:

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

Het zou moeten werken om gewoon javascript van Jane te mengen met je jQuery.

// 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);

Antwoord 20

Alle antwoorden hier zijn goed. Aangezien de vraag specificeert over het herladen van de pagina met jQuery, ik dacht gewoon iets meer toe te voegen voor toekomstige lezers.

jQuery is een platformonafhankelijke JavaScript-bibliotheek ontworpen om de client-side scripting van HTML te vereenvoudigen.

^{~ Wikipedia ~}

Dus je zult begrijpen dat de basis van jQuery, of jQuery is gebaseerd op javascript. Dus werken met pure javascript is veel beter als het gaat tot simpele dingen.

Maar als je een jQuery-oplossing nodig hebt, hier is er een.

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

Antwoord 21

Er zijn veel manieren om de huidige pagina’s opnieuw te laden, maar op de een of andere manier kunt u met deze benaderingen zien dat de pagina is bijgewerkt, maar niet met weinig cachewaarden, dus los dat probleem op of als u harde verzoeken wilt indienen, gebruik dan de onderstaande code .

    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

Antwoord 22

<i id="refresh" class="fa fa-refresh" aria-hidden="true"></i>
<script>
$(document).on('click','#refresh',function(){
   location.reload(true);
});
</script>

Antwoord 23

Eenvoudige Javascript-oplossing:

 location = location; 

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

history.go()

location.reload(); //simple refresh

location.reload(true);//hard refresh

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

window.location = '';

    location.reload(forceGet)

 location.reload()

location.reload(forceGet)

<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>