, bind()
dan kaedah lain untuk melaksanakan operasi yang dicetuskan peristiwa. Senarai berikut peristiwa utama yang perlu anda ketahui: live()
, blur
, focus
, focusin
, focusout
, load
, resize
, scroll
, unload
, click
, dblclick
>, mousedown
, mouseup
, mousemove
, mouseover
, mouseout
, mouseenter
, mouseleave
, change
, select
submit
peristiwa tetikus keydown
keypress
keyup
, error
,
, scroll
, click
, dblclick
, mousedown
, mouseup
mousemove
, mouseover
mouseout
>
mouseenter
Contoh: mouseleave
load
resize
peristiwa papan kekunci scroll
unload
error
,
,
(function($) { $(document).ready(function() { $('#id').bind('click', function(e) { // 鼠标事件触发(元素被点击) }); }); })(jQuery);
keydown
Peristiwa Pelayar keypress
keyup
,
,(function($) { $(document).ready(function() { $(document).bind('keypress', function(e) { // 键盘事件触发 }); }); })(jQuery);
load
Contoh: resize
scroll
unload
acara elemen dom error
,
,(function($) { $(document).ready(function() { // 浏览器事件触发(文档对象模型加载完成) }); })(jQuery);
, blur
, focus
focusin
focusout
Contoh: change
select
submit
Demo
sila rujuk: Cari kod kunci kekunci papan kekunci
(function($) { $(document).ready(function() { $('#id').bind('blur', function(e) { // DOM事件触发(输入焦点离开) }); }); })(jQuery);
dalam
?.bind()
jQuery kedua -duanya digunakan untuk melampirkan peristiwa ke unsur -unsur. Walau bagaimanapun, terdapat beberapa perbezaan utama antara kedua -dua. Kaedah .on()
adalah kaedah peristiwa tambahan yang asalnya disediakan oleh jQuery. Ia tidak berfungsi dengan unsur -unsur yang ditambah secara dinamik selepas halaman dimuatkan. Sebaliknya, kaedah dalam kod baru kerana ia mempunyai prestasi yang lebih baik dan lebih banyak ciri. .bind()
Untuk menyiarkan peristiwa dalam jQuery, anda boleh menggunakan kaedah .unbind()
. Kaedah ini memadam pengendali acara yang dilampirkan menggunakan kaedah .bind()
. Anda boleh memadam semua pengendali acara untuk elemen, atau hanya memadam pengendali acara tertentu dengan menentukan jenis acara sebagai parameter. Sebagai contoh, $("#element").unbind("click")
akan memadam semua pengendali acara klik untuk elemen dengan elemen id '.
Ya, anda boleh mengikat pelbagai peristiwa ke elemen yang sama dalam jQuery. Anda boleh melakukan ini dengan lulus objek ke kaedah .on()
, di mana kunci adalah nama acara dan nilai adalah pengendali acara. Sebagai contoh, $("#element").on({click: function(){}, mouseover: function(){}})
mengikat kedua -dua peristiwa klik dan tetikus ke elemen dengan "elemen" ID.
Untuk menghentikan penyebaran acara dalam jQuery, anda boleh menggunakan kaedah .stopPropagation()
. Kaedah ini menghalang peristiwa dari bubbled di Dom Tree, menghalang mana -mana pengendali induk daripada menerima pemberitahuan acara. Anda boleh memanggil kaedah ini dalam pengendali acara seperti berikut: function(event){ event.stopPropagation(); }
.
Delegasi Acara di JQuery adalah teknik di mana anda mewakilkan pemprosesan acara ke elemen induk dan bukannya mengikat peristiwa ke elemen tertentu. Ini amat berguna apabila anda mempunyai banyak elemen atau menambah elemen secara dinamik. Anda boleh menggunakan perwakilan acara dengan menentukan pemilih sebagai parameter kedua menggunakan kaedah .on()
. Sebagai contoh, $("#parent").on("click", ".child", function(){})
mewakilkan acara klik semua elemen kanak -kanak ke elemen induk.
Untuk mencetuskan peristiwa yang diprogramkan dalam jQuery, anda boleh menggunakan kaedah .trigger()
. Kaedah ini mencetuskan tingkah laku lalai peristiwa dan peristiwa yang ditentukan pada elemen yang dipilih (seperti penyerahan bentuk). Sebagai contoh, $("#element").trigger("click")
secara pemrograman akan mencetuskan acara klik pada elemen dengan elemen id '.
Ya, anda boleh lulus data ke pengendali acara dalam jQuery. Anda boleh melakukan ini dengan lulus objek sebagai parameter kedua ke kaedah .on()
. Ciri -ciri objek ini akan tersedia sebagai sifat dalam objek acara dalam pengendali acara. Sebagai contoh, $("#element").on("click", {name: "John"}, function(event){ alert(event.data.name); })
akan memaparkan "John" apabila elemen diklik.
.live()
dalam .on()
? dan .live()
dalam .on()
jQuery kedua -duanya digunakan untuk melampirkan peristiwa ke unsur -unsur. Walau bagaimanapun, terdapat beberapa batasan dan ciri -ciri kaedah .live()
yang tidak disengajakan dalam JQuery 1.7. Ia tidak berfungsi dengan peristiwa -peristiwa tertentu (seperti "Hantar" dan "Fokus") dan ia melampirkan pengendali acara ke akar dokumen, yang boleh menyebabkan masalah prestasi. Sebaliknya, kaedah .on()
mengatasi batasan -batasan ini dan kini kaedah yang disyorkan.
Untuk menyekat tindakan lalai peristiwa dalam jQuery, anda boleh menggunakan kaedah .preventDefault()
. Sekiranya acara itu dapat dibatalkan, kaedah ini membatalkan acara itu, yang bermaksud bahawa tindakan lalai yang dimiliki oleh peristiwa itu tidak akan berlaku. Anda boleh memanggil kaedah ini dalam pengendali acara seperti berikut: function(event){ event.preventDefault(); }
.
Ya, anda boleh mengikat peristiwa ke unsur -unsur hanya sekali dalam jQuery. Anda boleh menggunakan kaedah .one()
untuk mencapai matlamat ini. Kaedah ini berfungsi dengan cara yang sama seperti kaedah .on()
, tetapi selepas pengendali acara dipecat sekali, pengendali acara akan dipadamkan. Sebagai contoh, $("#element").one("click", function(){})
akan mencetuskan pengendali acara klik hanya sekali untuk elemen dengan id "elemen".
Atas ialah kandungan terperinci JQuery Senarai penuh peristiwa yang boleh anda mengikat. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!