Tombol yang menyegarkan halaman saat diklik


108

Saya membutuhkan tombol yang akan menyegarkan halaman pada klik pengguna. Saya mencoba ini:

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

atau

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

Tapi tidak ada yang berhasil.

Jawaban:


237

Gunakan onClickdengan window.location.reload(), yaitu:

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

Atau history.go(0), yaitu:

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

Atau window.location.href=window.location.hrefuntuk isi ulang ' penuh ', yaitu:

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

Elemen Tombol - developer.mozilla.org


2
apa perbedaan antara ketiga opsi ini? Apakah yang satu lebih baik dari yang lain untuk beberapa situasi?
ashleedawg

Saya tidak berpikir mereka memiliki keunggulan satu sama lain, hanya cara berbeda untuk mencapai hal yang sama.
CONvid19

1
Aku tidak akan mengangkat hidungku tapi ";" hilang di akhir onClick = "window.location.reload ();"
guido _nhcol.com.br_

1
seluruh pertanyaan ini adalah sintaks yang salah ... Saya terkejut itu memiliki hampir 200 suara positif. Pertama, tombol membutuhkan tag penutup di masing-masing, dan kedua, nilai bukan atribut dari tag tombol, teks harus berada di antara tag dan tag penutup
Mister SirCode

@TaylorS Anda benar sekali, saya sudah perbarui jawabannya, terima kasih.
CONvid19

10

Ini berhasil untuk saya

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>

Ini benar-benar bekerja sempurna untuk saya.


6

Hanya halaman yang benar-benar dimuat ulang ini (Hari Ini)

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

Yang lain tidak benar-benar memuat ulang. Mereka menyimpan nilai di dalam kotak teks.


Bisakah Anda menjelaskan apa yang Anda maksud dengan: " Hanya halaman yang benar-benar dimuat ulang ini (Hari Ini) "?
CONvid19

"Hari ini" berarti hari saya menulisnya (karena setiap hari ada yang berubah). "Hanya ini" relevan dengan jawaban yang diberikan di atas oleh Pedro Lobito.
ilias iliadis

2
Semua jawaban di SO adalah " pada hari ini " dan dapat diperbarui jika ada perubahan, itulah sifat dari hampir semua hal dalam hidup, tidak hanya jawaban.
CONvid19

5

tombol yang menyegarkan halaman saat diklik

Gunakan tombol onClick dengan window.location.reload ():

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

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

Ini mungkin terlihat lucu tetapi benar-benar berhasil.


4

Saya perhatikan bahwa semua jawaban di sini menggunakan onClickpenangan sebaris . Biasanya disarankan untuk memisahkan HTML dan Javascript.

Berikut adalah jawaban yang menambahkan pemroses kejadian klik langsung ke tombol. Ketika diklik, itu memanggil location.reload yang menyebabkan halaman memuat ulang dengan URL saat ini.

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

cukup buat referensi kosong pada link seperti berikut

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

1

Gunakan ini berfungsi dengan baik bagi saya untuk memuat ulang halaman yang sama:

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

0

Meskipun pertanyaannya adalah untuk button, tetapi jika ada yang ingin menyegarkan halaman menggunakan <a>, Anda dapat melakukannya

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

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

Atau Anda juga bisa menggunakan

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

Catatan: Ubah "<same page link>"dengan url halaman yang sama yang ingin Anda muat ulang. sebagai contoh: <form action="home.html> method="GET">


-1

Jika Anda mencari form reset:

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

atau untuk mengatur ulang aspek lain dari formulir yang tidak ditangani oleh browser

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

Menggunakan jQuery

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

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

Ini akan pergi ke jalur yang diperlukan dan Anda tidak akan mendapatkan prompt kirim ulang.

Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.