Hai semuanya, apa kabar? Show addEventListener adalah sebuah metode yang sangat penting yang digunakan untuk membuat event seperti click, dbclick, hover, blur, focus dan lain-lain untuk keperluan manipulasi di DOM javascript, walaupun sebenarnya banyak cara menjalankan event dengan javascript tapi kali ini kita akan belajar dengan menggunakan metode addEventListener pada javascript Biar lebih jelas langsung saja kita praktekkan, kali ini silahkan buat file dan ketikkan scriptnya seperti berikut 1 2 3 4 5 6 7 8 <html> <kepala> <judul>Pelatihan addEventListener< / judul> < / kepala> <tubuh> <button>Klik Saya. . < / tombol> < / tubuh> < / html> Saya membuat sebuah tombol yang nantinya akan kita beri metode addEventListener, idenya adalah ketika tombol tersebut di klik kita akan menampilkan pesan peringatan selamat pagi juara, jika kita menulis acara pemberian seperti biasa maka skrip yang kita tulis akan menjadi seperti berikut 1 2 3 4 5 var tombol = dokumen.getElementsByTagName("tombol"); tombol[0].klik = fungsi() { waspada("SELAMAT PAGI JUARA")< /a> Jika kita menggunakan metode addEventListener, skrip ditulis sebagai berikut 1 2 3 4 5 6 var tombol = dokumen.getElementsByTagName("tombol"); tombol[0].addEventListener('klik', fungsi(){ waspada("SELAMAT PAGI JUARA")< /a> }) Jadi jika kita jalankan di browser maka pada saat tombol di klik maka akan muncul pesan peringatan, kembalilah menggunakan nya sobat bebas untuk menggunakannya, kedua cara diatas tidak salah, bisa menggunakan salah satu cara diatas untuk memanipulasi elemen dengan javascript DOM Oke teman-teman untuk tutorial membuat event di javascript dengan addEventListener ini saya stop sampai disini dulu, sampai jumpa di tutorial berikutnya, selamat belajar Halo sobat Dumetschool, jumpa lagi dengan saya di website webdesign course. Pada artikel ini saya akan membahas tentang cara menggunakan Event Onchange pada opsi form select. Disini saya menggunakannya untuk menampung dan menampilkan suatu data, misalnya ketika kita memilih suatu kategori akan ada subkategori seperti itu kurang lebih. Fungsi Onchange ini saya gunakan pada pilihan select yang berfungsi untuk menampilkan suatu nilai atau data sesuai dengan pilihan yang dipilih, dalam hal ini saya membuat 2 pilihan atau pilihan, pada pilihan pertama atau sebagai judul atau kategori utama dan pada pilihan kedua sebagai subjudul atau bagian detail. Agar tidak bingung dan mudah dipahami, langsung saja kita praktekkan Pertama buat file HTML dan coba ketik sintaks HTML sebagai berikut 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 <. DOCTYPE html> <html> <kepala> <title>Menggunakan Perubahan pada Pilih opsi dengan Javascript< / judul> <tautan rel = "stylesheet" href = "https. // jalur tumpukan. bootstrapcdn. com/bootstrap/4. 3. 1/css/bootstrap. min. css"> < / kepala> <tubuh> <div kelas = "wadah mt-5 "> <div kelas = "baris"> <div kelas = "col-md- 4"> <h3>Kendaraan Roda Dua< / h3> < / div> <div kelas = "col-md- 4"> Model Kendaraan . <pilih id = "pilih" nama = "pilih" ubah = "mengisi(ini. id,'pilih')"> <opsi nilai = "">< / opsi> <opsi nilai = "Matic">Matic< / opsi> <opsi nilai = "Semi Olahraga"< /a>>Semi Olahraga< /< /a> opsi> <opsi nilai = "Olahraga">Olahraga< / opsi> < / pilih> <br>< / div> <div kelas = "col-md- 4"> Nama Model. <pilih id = "pilih" nama = "pilih">< / pilih> < / div> < / div>< / div> < / tubuh> < / html> Selanjutnya sahabat ketikan script dari Javascript nya sisipkan pada diantara tag seperti dibawah ini:1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 penjelasan pada script di atas function populate(plh,mlh) adalah nilai dari Onchange, anda dapat mengamatinya pada file HTML yang terdapat pada id=”select”, dan saya menggunakan var plh, var mlh untuk mengambil atau menampung nilai tersebut berdasarkan pada id di setiap opsi pilih. Jadi setiap nilai pilih pertama memiliki data array yang bila salah satu dipilih akan menampilkan data pada opsi pilih kedua. Jika Anda menjalankannya di browser, maka akan terlihat seperti di bawah ini  Itulah pembahasan artikel tentang Cara Menggunakan Event Onchange di Javascript, semoga bermanfaat dan selamat mencoba, sampai jumpa lagi di artikel lainnya Apa itu event JavaScript?Pada Javascript. Peristiwa adalah peristiwa yang terjadi di halaman web . Peristiwa yang dimaksud di sini adalah aktivitas yang dilakukan di halaman web.
Bagaimana cara memanggil fungsi dalam JavaScript?Cara Memanggil/Menjalankan Fungsi
. Nama fungsi(); Contoh. // buat fungsi function sayHello(){ console. log("Halo Dunia. "); } // panggil fungsi sayHello() // kemudian akan menghasilkan -> Hello World.
Apa fungsi menambahkan pendengar acara?AddEventListener adalah metode yang sangat penting dalam JavaScript. Merupakan metode yang berfungsi untuk membuat event (klik, ubah, mouseout, dll) untuk kebutuhan manipulasi DOM . Pada artikel ini, saya akan menunjukkan cara menggunakannya.
2 Apa nama peristiwa yang terjadi saat pengguna mengeklik elemen HTML?onclick = adalah event jika elemen html diklik. |
Cara menggunakan EBENTOS di JavaScript
Pos Terkait
Copyright © 2024 kemunculan Inc.
