cari

Rumah >hujung hadapan web >tutorial js >Penjelasan terperinci tentang jQuery siblings() use examples_jquery

Penjelasan terperinci tentang jQuery siblings() use examples_jquery

WBOY
WBOYasal
2016-05-16 15:03:501784semak imbas

adik-beradik() Dapatkan adik-beradik setiap elemen dalam set padanan Penapisan mengikut pemilih adalah pilihan.

kaedah traversal jQuery()

$("给定元素").siblings(".selected")

Fungsinya adalah untuk menapis elemen adik beradik yang diberikan (tidak termasuk elemen yang diberikan itu sendiri)

Contoh: Bar pilihan halaman web

Apabila anda mengklik mana-mana tab, dua tab yang lain akan menukar gayanya dan kandungannya akan disembunyikan.

Berikut ialah kod html. 

<body>
<ul id="menu">
<li class="tabFocus">家居</li>
<li>电器</li>
<li>二手</li>
</ul>
<ul id="content">
<li class="conFocus">我是家居的内容</li>
<li>欢迎您来到电器城</li>
<li>二手市场，产品丰富多彩</li>
</ul>
</body>

kod jQuery

<script type="text/javascript">
$(function() {
$("#menu li").each(function(index) { //带参数遍历各个选项卡
$(this).click(function() { //注册每个选卡的单击事件
$("#menu li.tabFocus").removeClass("tabFocus"); //移除已选中的样式
$(this).addClass("tabFocus"); //增加当前选中项的样式
//显示选项卡对应的内容并隐藏未被选中的内容
$("#content li:eq(" + index + ")").show()
.siblings().hide();//#menu与#content在html层没有嵌套关联，但因为其ul序列相同，用index值可以巧妙的将两者关联。
});
});
})
</script>

Yang

Apabila tab yang sepadan diklik, kandungan tab yang diklik akan ditunjukkan(). Dua lagi elemen adik beradik 25edfb22a4f469ecb59f1190150159c6 ditapis menggunakan silibings() dan hide() dialih keluar.

Dengan cara ini, kandungan kawasan yang diklik boleh dipaparkan secara dinamik, manakala dua tab yang lain boleh disembunyikan.

dan

$("给定元素").siblings(".selected")
(".selected") dalam

bermaksud menapis elemen adik-beradik kelas elemen yang diberi bernama .selected (tidak termasuk elemen yang diberikan itu sendiri)

Kandungan di atas adalah penjelasan terperinci tentang contoh penggunaan jQuery siblings() Saya harap ia akan membantu semua orang!

Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：Kod pelaksanaan JQuery untuk menambah/memadam nod untuk dipilihArtikel seterusnya：Kod pelaksanaan JQuery untuk menambah/memadam nod untuk dipilih

Artikel berkaitan

Lihat lagi