Javascript: Membuat Simulasi Mouse Click Element HTML
Snippet JavaScript ini adalah untuk melakukan simulasi klik element HTML. Penggunaannya bisa dilakukan di browser console. Untuk klik element dengan action sederhana seperti anchor link atau button, bisa menggunakan
Script dasar: (Sumber: Stackoverflow)
Penggunaannya script ini secara nyata yang saya praktekkan adalah untuk mengklik 50 tombol toggle on/off dalam satu halaman web dimana disitu tidak disediakan menu Toggle All, jadi harus meng-klik satu persatu semua tombolnya. Kalau cuma 50 tombol saja (hanya 1 page) saya bisa meng-klik satu persatu secara manual. Tetapi karena ada 10 page, jadi ada total 450 lebih item yang harus diklik, saya buat script otomatisnya. Saya adalah orang yang sangat malas untuk melakukan sesuatu secara manual yang berulang-ulang :D. Berikut adalah modifikasi script dasar untuk menjalankan otomatisasi klik tombol tadi:
Script diatas dieksekusi di browser console. Untuk menampilkan browser console bisa dengan shortcut
Bila anda tidak faham dengan artikel ini, abaikan saja. Snippet ini saya tulis untuk catatan pribadi. Kalau anda suka utak-atik javascript di browser console, dan menyukai otomatisasi pekerjaan, mungkin artikel ini bermanfaat.
Sumber: http://stackoverflow.com/a/4176116/2110506
Referensi javascript:
http://www.w3schools.com/js/js_loop_for.asp
http://www.w3schools.com/js/js_htmldom_elements.asp
http://www.w3schools.com/jsref/met_document_getelementsbyclassname.asp
element.click();
. Namun ketika element yang diklik melakukan action berdasarkan event click yang dibaca oleh jquery/ajax, penggunaan metode element.click();
mungkin tidak memberikan action klik yang dimaksud. Untuk itu digunakanlah function berikut:Script dasar: (Sumber: Stackoverflow)
var dispatchMouseEvent = function(target, var_args) { var e = document.createEvent("MouseEvents"); // If you need clientX, clientY, etc., you can call // initMouseEvent instead of initEvent e.initEvent.apply(e, Array.prototype.slice.call(arguments, 1)); target.dispatchEvent(e); }; dispatchMouseEvent(element, 'mouseover', true, true); dispatchMouseEvent(element, 'mousedown', true, true); dispatchMouseEvent(element, 'click', true, true); dispatchMouseEvent(element, 'mouseup', true, true);
Penggunaannya script ini secara nyata yang saya praktekkan adalah untuk mengklik 50 tombol toggle on/off dalam satu halaman web dimana disitu tidak disediakan menu Toggle All, jadi harus meng-klik satu persatu semua tombolnya. Kalau cuma 50 tombol saja (hanya 1 page) saya bisa meng-klik satu persatu secara manual. Tetapi karena ada 10 page, jadi ada total 450 lebih item yang harus diklik, saya buat script otomatisnya. Saya adalah orang yang sangat malas untuk melakukan sesuatu secara manual yang berulang-ulang :D. Berikut adalah modifikasi script dasar untuk menjalankan otomatisasi klik tombol tadi:
var dispatchMouseEvent = function(target, var_args) { var e = document.createEvent("MouseEvents"); // If you need clientX, clientY, etc., you can call // initMouseEvent instead of initEvent e.initEvent.apply(e, Array.prototype.slice.call(arguments, 1)); target.dispatchEvent(e); }; //mengambil element yang akan diklik otomatis //karena element lebih dari satu dan classnya sama, saya menggunakan getElementsByClassName var a = document.getElementsByClassName('gwt-Image arc-toggle-button-cursor'); //looping semua element hasil dari getElementsByClassName for(var i = 0; i < a.length; i++) { var element = a[i]; dispatchMouseEvent(element, 'mouseover', true, true); dispatchMouseEvent(element, 'mousedown', true, true); dispatchMouseEvent(element, 'click', true, true); dispatchMouseEvent(element, 'mouseup', true, true); }
Script diatas dieksekusi di browser console. Untuk menampilkan browser console bisa dengan shortcut
Ctrl
+Shift
+K
di Firefox/Chrome.Bila anda tidak faham dengan artikel ini, abaikan saja. Snippet ini saya tulis untuk catatan pribadi. Kalau anda suka utak-atik javascript di browser console, dan menyukai otomatisasi pekerjaan, mungkin artikel ini bermanfaat.
Sumber: http://stackoverflow.com/a/4176116/2110506
Referensi javascript:
http://www.w3schools.com/js/js_loop_for.asp
http://www.w3schools.com/js/js_htmldom_elements.asp
http://www.w3schools.com/jsref/met_document_getelementsbyclassname.asp
Javascript: Membuat Simulasi Mouse Click Element HTML
Reviewed by Errorisme
on
May 28, 2016
Rating:
Bro Ero bukan nih ?
ReplyDeleteWah lama tak jumpa mas bro :D
masih dengan errorisme yg sama :D
DeleteSaudara Lukman masih exist kah? itu blog aku visit kok lambat betul, kayaknya cdn nya tewas tuh
Deletemas kok ndak pernah update lg?
ReplyDeletegak ada bahan.. hahaha
Deletebikin aplikasi mobile blog lagi dong mass
ReplyDeletekayak yang dulu :D
iyo kui gawe aplisane maneh
ReplyDeleteMas Kangen sama Mobile Blog nya..
ReplyDeleteTolong di kembangkan lagi..
karena sangat mudah di gunakan..
udah gak ada lagi tutorial buat eMobileBlog nya mmas,,
Deletekami rindu dengan hasil karya mu..
aku user 2013 an wkwk
2018 harus ada ya pokoknya hahaha
sudahlah,, pakai blogspot saja :D
DeleteEr, bikin tutor vb.net dong
ReplyDeleteKan udah ada banyak cup, lagian aku gak maen vb.net
Deleteapa kabra emobileblog?
ReplyDeletesempat vakum dari 7 tahun lalu kayaknya :D
eh 2021 masih saya pake dan sekarang saya kembangkan!
wah masih ada yg pakai ternyata, padahal yg bikin aja udah lupa wkwkwk
DeleteArkadaşlarla Oynanabilecek Oyunlar
ReplyDeletePubg Benzeri Oyunlar
Age of Empires Benzeri Oyunlar
Team Fortress Benzeri Oyunlar
İkariam Benzeri Oyunlar
Smite Benzeri Oyunlar
S6N