Latest web development tutorials

jQuery Kegiatan

jQuery dirancang khusus untuk event handler.

Apa acara?

Halaman menanggapi pengunjung yang berbeda yang disebut peristiwa.

Metode event handler berarti bahwa bila ada kejadian tertentu HTML ketika dijalankan.

contoh:

  • Menggerakkan mouse di atas elemen.
  • Pilih tombol radio
  • klik elemen

Istilah ini sering digunakan dalam acara "memicu" (atau "eksitasi"), misalnya: "acara memicu menekan tombol ketika Anda menekan tombol."

Peristiwa DOM umum:

鼠标事件 键盘事件 表单事件 文档/窗口事件
click keypress submit load
dblclick keydown change resize
mouseenter keyup focus scroll
mouseleave blur unload  

jQuery metode event sintaks

Dalam jQuery, sebagian besar peristiwa DOM memiliki setara dengan metode jQuery.

Halaman, menentukan acara klik:

. $ ( "P") klik ();

Langkah selanjutnya adalah menentukan apa waktu peristiwa pemicu. Anda dapat menerapkan fungsi acara:

$ ( "P"). Klik (function () {
Setelah kode !! // aksi dipicu
});

Umum digunakan metode event jQuery

$ (Document) .ready ()

Metode $ (Dokumen) .ready () memungkinkan kita untuk sepenuhnya memuat dokumen setelah eksekusi fungsi. Metode acara di sintaks jQuery bagian telah disebutkan.

klik ()

klik metode () saat acara klik tombol dipicu panggilan fungsi.

Fungsi ini dijalankan ketika pengguna mengklik pada sebuah elemen HTML.

Pada contoh berikut, ketika Anda klik pada <p> elemen event-dipicu untuk menyembunyikan saat <p> elemen:

contoh

$("p").click(function(){
$(this).hide();
});

Coba »

DblClick ()

Ketika Anda klik dua kali elemen, acara DblClick terjadi.

DblClick () metode DblClick memicu event, atau fungsi yang telah ditetapkan untuk menjalankan ketika peristiwa itu terjadi DblClick:

contoh

$("p").dblclick(function(){
$(this).hide();
});

Coba »

mouseenter ()

Ketika pointer mouse di elemen, acara mouseenter terjadi.

mouseenter () event metode mouseenter pemicu, atau fungsi yang telah ditetapkan untuk menjalankan ketika peristiwa itu terjadi mouseenter:

contoh

$("#p1").mouseenter(function(){
alert("You entered p1!");
});

Coba »

mouseleave ()

Ketika pointer mouse meninggalkan elemen, acara mouseleave terjadi.

mouseleave () metode mouseleave memicu event, atau ketika fungsi yang telah ditetapkan untuk menjalankan ketika peristiwa itu terjadi mouseleave:

contoh

$("#p1").mouseleave(function(){
alert("Bye! You now leave p1!");
});

Coba »

mousedown ()

Ketika pointer mouse bergerak lebih elemen dan menekan tombol mouse, acara mousedown terjadi.

mousedown () metode memicu acara mousedown atau fungsi tertentu saat menjalankan acara mousedown terjadi:

contoh

$("#p1").mousedown(function(){
alert("Mouse down over p1!");
});

Coba »

mouseup ()

Ketika tombol mouse dilepas lebih dari elemen, acara mouseup terjadi.

mouseup () event metode mouseup pemicu, atau fungsi yang telah ditetapkan untuk menjalankan ketika peristiwa itu terjadi mouseup:

contoh

$("#p1").mouseup(function(){
alert("Mouse up over p1!");
});

Coba »

arahkan ()

Metode melayang () digunakan untuk mensimulasikan kursor melayang di atas acara tersebut.

Ketika mouse bergerak ke elemen, itu akan memicu fungsi tertentu pertama (mouseenter); ketika mouse bergerak off dari elemen, itu akan memicu fungsi tertentu kedua (mouseleave).

contoh

$("#p1").hover(function(){
alert("You entered p1!");
},
function(){
alert("Bye! You now leave p1!");
});

Coba »

fokus ()

Ketika elemen mendapat fokus, peristiwa fokus terjadi.

Ketika mouse klik pada elemen atau unsur-unsur yang dipilih dengan menargetkan tombol tab, elemen akan menjadi fokus.

Fokus () metode memicu acara fokus, atau fungsi yang telah ditetapkan untuk menjalankan ketika peristiwa itu terjadi fokus:

contoh

$("input").focus(function(){
$(this).css("background-color","#cccccc");
});

Coba »

blur ()

Ketika elemen kehilangan fokus, acara blur terjadi.

blur () metode memicu event blur atau fungsi untuk menjalankan ketika peristiwa yang telah ditentukan terjadi blur:

contoh

$("input").blur(function(){
$(this).css("background-color","#ffffff");
});

Coba »