Bagaimana untuk Mencegah Penyegaran Halaman Yang Tidak Diingini Apabila Mengklik Butang dalam Borang?

Mencegah Muat Semula Halaman pada Klik Butang dalam Borang

Apabila menggunakan butang dalam borang, adalah penting untuk mengelakkan muat semula halaman secara tidak sengaja yang mengganggu aliran pengguna . Isu ini boleh timbul apabila butang digunakan untuk mencetuskan fungsi tanpa menyerahkan borang.

Dalam contoh kod yang disediakan:

<form method="POST">
    <button name="data" onclick="getData()">Click</button>
</form>

Isu ini disebabkan oleh kelakuan lalai butang, iaitu untuk menghantar borang. Apabila butang diklik, borang diserahkan, menghasilkan penyegaran halaman. Untuk mengelakkan muat semula yang tidak diingini ini, pengubahsuaian berikut boleh dibuat:

Tambah type="button" pada Butang

<button name="data" type="button" onclick="getData()">Click</button>

Dengan menambahkan type="button" , tingkah laku serah lalai butang ditindih dan ia tidak lagi memulakan penyerahan borang. Sebaliknya, ia hanya melaksanakan fungsi getData() yang ditentukan tanpa menyebabkan muat semula halaman.

Mengapa Gunakan type="button"?

Secara lalai, butang dalam borang mempunyai jenis "serahkan", yang bermaksud ia mencetuskan penyerahan borang apabila diklik. Atribut type="button" mengalih keluar tingkah laku lalai ini dan menjadikan butang bertindak sebagai butang tersuai yang memanggil fungsi yang diingini tanpa sebarang penyerahan borang.

Atas ialah kandungan terperinci Bagaimana untuk Mencegah Penyegaran Halaman Yang Tidak Diingini Apabila Mengklik Butang dalam Borang?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!