JQuery Senarai penuh peristiwa yang boleh anda mengikat

JavaScript yang digabungkan dengan jQuery boleh menangkap banyak peristiwa tetikus, peristiwa papan kekunci, peristiwa pelayar dan peristiwa elemen DOM, dan menggunakan

, 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);

Contoh:

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);

JQuery Event mengikat Senarai Soalan Lazim (Soalan Lazim)

Apakah perbezaan antara

dan

dalam

?

Kaedah

dan

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

yang diperkenalkan dalam JQuery 1.7 sesuai untuk kedua -dua elemen dan elemen sedia ada yang dinamik ditambah kemudian. Kini ia disyorkan untuk menggunakan

dalam kod baru kerana ia mempunyai prestasi yang lebih baik dan lebih banyak ciri. .bind()

Bagaimana untuk membuka peristiwa dalam jQuery?

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 '.

Bolehkah saya mengikat pelbagai peristiwa ke elemen yang sama dalam jQuery?

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.

Bagaimana untuk menghentikan penyebaran acara dalam jQuery?

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(); }.

Apakah perwakilan acara dalam jQuery dan bagaimana saya boleh menggunakannya?

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.

Bagaimana untuk mencetuskan peristiwa secara pemrograman dalam jQuery?

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 '.

Bolehkah saya lulus data ke pengendali acara dalam jQuery?

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.

Apakah perbezaan antara

dan .live() dalam .on()?

Kaedah

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.

Bagaimana untuk menyekat tindakan lalai peristiwa dalam jQuery?

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(); }.

Bolehkah saya mengikat peristiwa ke unsur -unsur hanya sekali dalam jQuery?

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!