Tombol di halaman web digunakan untuk memberikan pengalaman pengguna yang interaktif. Sebagai aturan, jika respons terhadap klik tombol tidak memerlukan pengiriman data ke server, maka interaksi diimplementasikan menggunakan skrip JavaScript. Metode untuk memanggil kode JavaScript yang sesuai dapat bervariasi - di bawah ini adalah beberapa opsi yang memungkinkan untuk berbagai jenis tombol.
instruksi
Langkah 1
Jika tampilan tombol di halaman web diatur menggunakan tag tombol, maka kode JavaScript dapat ditempatkan di atribut onclick. Misalnya, seperti ini: tombol Tentu saja, tidak disarankan untuk memasukkan kode yang cukup besar langsung ke tag tombol - lebih baik mendesainnya sebagai fungsi, dan hanya memasukkan kode untuk memanggil fungsi ini ke dalam atribut onclick. Sebagai contoh:
fungsi showAlert() {
alert ('Tombol diklik!')
}
tombol
Langkah 2
Jika tombol ditampilkan melalui salah satu variasi tag input (kirim, setel ulang, tombol, atau gambar), maka atribut onclick yang sama dapat digunakan. Misalnya, untuk tombol untuk menghapus bidang formulir (reset), kodenya mungkin terlihat seperti ini: Jika Anda hanya ingin JavaScript dijalankan saat tombol diklik, dan tindakan default tidak terjadi, tambahkan perintah return ke fungsi atau langsung ke atribut onclick false. Sebagai contoh:
Langkah 3
Jika Anda perlu mengatur respons untuk mengklik tombol dari jenis kirim, maka, selain metode di atas menggunakan atribut onclick, Anda dapat menggunakan properti dari tag formulir tempat tombol ini berada. Panggilan fungsi yang sesuai dapat ditempatkan di atribut onsubmit dari tag formulir. Sebagai contoh:
Langkah 4
Jika tombol bukan elemen formulir, tetapi hanya elemen grafis (tag img), maka standar untuk itu juga mengizinkan penggunaan atribut onclick. Sebagai contoh:
Langkah 5
Jika tombolnya adalah hyperlink, maka Anda tidak boleh menggunakan atribut tombol itu sendiri; lebih baik menggunakan properti dari tag tautan. Anda dapat, seperti pada opsi sebelumnya, menggunakan tag onclick. Misalnya: Dan Anda dapat mengganti alamat di atribut href dengan panggilan fungsi. Misalnya seperti ini:
