javascript - 如何取得頁面中不同集合中相同元素的索引
迷茫
迷茫 2017-05-19 10:07:53
0
3
494


怎麼給這些相同元素button加點擊事件,分別顯示跟隱藏對應的下面UL標籤!

迷茫
迷茫

业精于勤,荒于嬉;行成于思,毁于随。

全部回覆(3)
为情所困

原生js的話可以建構一個顯隱函數,然後遍歷給每個btn。顯隱函數可以透過css3的transition改變ul的高度,或是改變display、opacity,具體得根據實際情況來定。簡單一點可以用jQuery中的fade,slide。

大家讲道理

這是個XY問題

目的不是為了得到元素索引,而是給同類元素綁定類似的事件處理

為所有要綁定事件的按鈕添加一個特殊的類別

<button id="btn1" class="btn-toggle-menu">1</button>
<ul>...</ul>
<button id="btn2" class="btn-toggle-menu">2</button>
<ul>...</ul>
<button id="btn3" class="btn-toggle-menu">3</button>
<ul>...</ul>
<button id="btn4" class="btn-toggle-menu">4</button>
<ul>...</ul>

透過類別選取這些元素綁定處理就好了

$('button.btn-tobble-menu').each(function(){
    $(this).next().hide() // 隐藏按钮后面紧跟的元素
})
$('button.btn-toggle-menu').click(function(){
    $(this).next().show() // 显示按钮后面紧跟的元素
})
滿天的星座

給每個button 加上相同的class=“btn bt1” class=“btn bt2” class=“btn bt3”

$('.btn').click(function(){
$(".btunder").hide();

$(this).next(".btunder").show() ;

})

熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板