Schaltfläche, die die Seite beim Klicken aktualisiert


107

Ich benötige eine Schaltfläche, die die Seite beim Klicken des Benutzers aktualisiert. Ich habe es versucht:

<input type="button" value="Reload Page" onClick="reload">

oder

<input type="button" value="Refresh Page" onClick="refresh">

Aber beides hat nicht funktioniert.

Antworten:


237

Verwenden Sie onClickmit window.location.reload(), dh:

<button onClick="window.location.reload();">Refresh Page</button>

Oder history.go(0)dh:

<button onClick="history.go(0);">Refresh Page</button>

Oder window.location.href=window.location.hrefzum " vollständigen " Nachladen, dh:

<button onClick="window.location.href=window.location.href">Refresh Page</button>

Das Button-Element - developer.mozilla.org


2
Was ist der Unterschied zwischen diesen drei Optionen? Ist einer in manchen Situationen besser als der andere?
Ashleedawg

Ich denke nicht, dass sie Vorteile gegenüber einander haben, sondern nur verschiedene Wege, um dasselbe zu erreichen.
CONvid19

1
Ich werde meine Nase nicht hochdrehen, sondern ein ";" fehlt am Ende von onClick = "window.location.reload ();"
guido _nhcol.com.br_

1
Diese ganze Frage ist eine falsche Syntax ... Ich bin überrascht, dass sie fast 200 positive Stimmen hat. Erstens benötigt die Schaltfläche jeweils ein schließendes Tag, und zweitens ist der Wert kein Attribut der Schaltflächen-Tags. Der Text muss zwischen dem Tag und dem schließenden Tag
Mister SirCode

@ TaylorS Du hast vollkommen recht, ich habe die Antwort aktualisiert, danke.
CONvid19

10

Das funktioniert bei mir

HTML

    <button type="submit"  onClick="refreshPage()">Refresh Button</button>

JavaScript

<script>
function refreshPage(){
    window.location.reload();
} 
</script>

7
<a onClick="window.location.reload()">Refresh</a>

Das funktioniert wirklich perfekt für mich.


6

Nur diese Seite wird wirklich neu geladen (heute)

<input type="button" value="Refresh Page" onClick="location.href=location.href">

Andere laden nicht genau nach. Sie behalten Werte in Textfeldern.


Können Sie bitte erklären, was Sie damit meinen: " Nur diese Seite wird wirklich neu geladen (heute) "?
CONvid19

"Heute" bedeutet den Tag, an dem ich es geschrieben habe (weil sich jeden Tag etwas ändert). "Nur das" ist relevant für die Antworten von Pedro Lobito.
Ilias Iliadis

2
Alle Antworten auf SO sind " ab heute " und müssen aktualisiert werden, wenn sich etwas ändert. Das ist die Natur von fast allem im Leben, nicht nur Antworten.
CONvid19

5

Schaltfläche, die die Seite beim Klicken aktualisiert

Verwenden Sie die onClick-Schaltfläche mit window.location.reload ():

<button onClick="window.location.reload();">

4
<button onclick=location=URL>Refresh</button>

Das mag lustig aussehen, aber es macht wirklich den Trick.


4

Mir ist aufgefallen, dass alle Antworten hier Inline verwenden onClick Handler verwenden. Es wird allgemein empfohlen, HTML und Javascript getrennt zu halten.

Hier ist eine Antwort, die einen Klickereignis- Listener direkt zur Schaltfläche hinzufügt . Wenn darauf geklickt wird, wird location.reload aufgerufen, wodurch die Seite mit der aktuellen URL neu geladen wird.

const refreshButton = document.querySelector('.refresh-button');

const refreshPage = () => {
  location.reload();
}

refreshButton.addEventListener('click', refreshPage)
.demo-image {
  display: block;
}
<button class="refresh-button">Refresh!</button>
<img class="demo-image" src="https://picsum.photos/200/300">


3

Erstellen Sie einfach die leere Referenz auf dem Link wie folgt

 <a href="" onclick="dummy(0);return false;" >

1

Verwenden Sie diese Funktion, damit ich dieselbe Seite neu laden kann:

<button onClick="window.location.reload();">

0

Die Frage ist zwar für button, aber wenn jemand die Seite mit aktualisieren möchte <a>, können Sie dies einfach tun

<a href="./">Reload</a>

0
<button onClick="window.location.reload();">Reload</button>

Oder Sie können auch verwenden

<form action="<same page url>" method="GET">
<button>Reload</button>
</form>

Hinweis: Ändern Sie "<same page link>"mit der URL derselben Seite, die Sie neu laden möchten. beispielsweise: <form action="home.html> method="GET">


-1

Wenn Sie nach einem Zurücksetzen des Formulars suchen:

<input type="reset" value="Reset Form Values"/>

oder um andere Aspekte des Formulars zurückzusetzen, die nicht vom Browser verarbeitet werden

<input type="reset" onclick="doFormReset();" value="Reset Form Values"/>

Verwenden von jQuery

function doFormReset(){
    $(".invalid").removeClass("invalid");
}

-5
window.opener.location.href ='workItem.adm?wiId='+${param.wiId};

Es wird zum gewünschten Pfad geleitet und Sie erhalten keine Aufforderung zum erneuten Senden.

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.