Saya punya formulir. Di luar formulir itu, saya punya tombol. Tombol sederhana, seperti ini:
<button>My Button</button>Namun demikian, ketika saya mengkliknya, ia mengirimkan formulir. Berikut kodenya:
<form id="myform">
<input />
</form>
<button>My Button</button>
Yang harus dilakukan tombol ini hanyalah JavaScript. Tetapi bahkan ketika itu terlihat seperti pada kode di atas, ia mengirimkan formulir. Ketika saya mengubah tombol tag ke span, ia bekerja dengan sempurna. Namun sayangnya, itu perlu tombol. Apakah ada cara untuk memblokir tombol itu dari mengirimkan formulir? Seperti misalnya
<button onclick="document.getElementById('myform').doNotSubmit();">My Button</button>
javascript
html
arik
sumber
sumber
buttonadalahtype=submit, tidak ada formulir yang dikirimkan ketikabuttonelemen berada di luar formulir apa pun. Kecuali demonstrasi yang sebenarnya (dokumen sampel, identifikasi browser, dan deskripsi pengamatan yang menunjukkan bahwa beberapa formulir dikirimkan) dapat diberikan, pertanyaan ini harus ditutup karena tidak dapat direproduksi. Menggunakantype=buttonadalah praktik yang baik, tetapi ini tidak membuat masalah menjadi nyata.Jawaban:
Saya pikir ini adalah kekhasan kecil yang paling menjengkelkan dari HTML ... Tombol itu harus bertipe "tombol" agar tidak mengirimkan.
Pembaruan 5-Feb-2019: Sesuai dengan Standar Kehidupan HTML (dan juga spesifikasi HTML 5 ):
sumber
to use <button><button>s yang salah dalam beberapa kasus. Selain itu,<button>tidak 100% kompatibel lintas-browser karena browser yang berbeda dapat mengirimkan nilai yang berbeda untuk yang sama<button>ketika digunakan dalam formulir.typeatribut dalam<button>tag adalahsubmit. Ketika diubah menjaditype=button,<button>tidak diberikan perilaku default. Lihattypeatribut di sini: developer.mozilla.org/en-US/docs/Web/HTML/Element/button<button type='submit'>itu terlalu sulit bagiku haha. Bagaimanapun jawaban Anda bekerja dengan baik!return false;pada akhir handler onclick akan melakukan pekerjaan. Namun, lebih baik menambahkantype="button"saja<button>- dengan cara itu berperilaku baik bahkan tanpa JavaScript.sumber
return false;tidak berfungsi di semua skenario, sementaratype="Button"tidak. Bahkan dengan JavaScript yang diaktifkan.Dave Markle benar. Dari situs web W3School :
Dengan kata lain, browser yang Anda gunakan mengikuti spesifikasi W3C.
sumber
Secara default, tombol html mengirimkan formulir.
Dengan kata lain, tipe tombol "kirim" secara default
Untuk mengetahui lebih lanjut, lihat informasi tombol Pengembang Jaringan Mozilla: https://developer.mozilla.org/en/docs/Web/HTML/Element/button
sumber
Disarankan untuk tidak menggunakan
<Button>tag. Gunakan<Input type='Button' onclick='return false;'>tag sebagai gantinya. (Menggunakan "return false" seharusnya tidak mengirim formulir.)Beberapa bahan referensi
sumber
<input type="button" />, dan cukup untukreturn false;- tidak perlu melakukan keduanya.Untuk alasan aksesibilitas, saya tidak dapat melakukannya dengan beberapa
type=submittombol. Satu-satunya cara untuk bekerja secara native denganformbeberapa tombol tetapi HANYA satu dapat mengirimkan formulir ketika menekanEntertombol adalah untuk memastikan bahwa hanya satu dari mereka yang adatype=submitsementara yang lain dalam jenis lain sepertitype=button. Dengan cara ini, Anda bisa mendapatkan keuntungan dari pengalaman pengguna yang lebih baik dalam berurusan dengan formulir di browser dalam hal dukungan keyboard.sumber
Pilihan lain yang berhasil bagi saya adalah menambahkan onsubmit = "return false;" ke tag formulir.
Semantik mungkin bukan solusi yang baik seperti metode di atas untuk mengubah jenis tombol, tetapi tampaknya menjadi pilihan jika Anda hanya menginginkan elemen bentuk yang tidak akan dikirimkan.
sumber