Rumah > Artikel > hujung hadapan web > Contoh menggunakan fungsi toggle() dalam jQuery_jquery
Saya menemui contoh menarik hari ini dan merakamnya.
Menu peringkat pertama mempunyai menu peringkat kedua di dalam Menu peringkat kedua memautkan elemen halaman melalui titik utama. Kesan yang diingini ialah apabila sauh diklik, halaman dipautkan ke sauh yang sepadan, dan menu tahap kedua disembunyikan Apabila menu tahap pertama diklik semula, pelaksanaan diteruskan. .
Saya mencuba banyak kaedah tetapi ia tidak berjaya Akhirnya, saya menyedarinya dengan membaca fungsi togol jquery.
//这样写可以 $(".nav").toggle(function(){ $(".content").slideToggle(); }); //这样写不可以 $(".nav").toggle(function(){ $(".content").slideDown(); },function(){ $(".content").slideUp(); }); //这样写也可以 $(".nav").click(function(){ $(".content").toggle("slow"); });
Dilampirkan arahan untuk menggunakan toggle()
togol(fn,fn)
Tukar fungsi untuk dipanggil pada setiap klik.
Jika elemen padanan diklik, fungsi pertama yang ditentukan akan dicetuskan, dan apabila elemen yang sama diklik semula, fungsi kedua yang ditentukan akan dicetuskan. Setiap klik seterusnya mengulangi panggilan ke dua fungsi ini secara bergilir-gilir.
Boleh dipadam menggunakan unbind("klik").
Nilai pulangan
jQuery
Parameter
fn (Fungsi): Fungsi yang akan dilaksanakan apabila klik bernombor ganjil dibuat.
fn (Fungsi): Fungsi yang akan dilaksanakan apabila klik bernombor genap dibuat.
Contoh
Tukar kelas ke meja
Kod jQuery:
$("td").toggle( function () { $(this).addClass("selected"); }, function () { $(this).removeClass("selected"); } );
Tambahan: togol hanya berfungsi apabila diklik, tuding hanyalah peristiwa apabila tetikus bergerak masuk dan keluar, dan tiada kaitan dengan klik. Kedua-duanya boleh digunakan bersama