jQuery選擇錯誤

HTML：jQuery選擇錯誤

<div id="accordion"> 
    <div class="top"> 
     <a href="" class="showAll">Show all</a> &nbsp; | &nbsp; <a href="" class="hideAll">Hide all</a> 
    </div> 
    <div class="body"> 
     <div class="item"> 
      <a href="" class="head" title="show">item1</a> 
      <div class="content"> 
       <p> 
        Item1 content; 
       </p> 
       <a href="" class="backToTop">Back to top</a> 
      </div> 
     </div> 
     <div class="item"> 
      <a href="" class="head" title="show">Item2</a> 
      <div class="content"> 
       <ul> 
        <li>item2 content;</li> 
        <li style="list-style: none"><a href="" class="backToTop">Back to top</a></li> 
       </ul> 
      </div> 
     </div> 
    </div> 
</div>

JS：

$("#accordion .content").slideUp(); 
$("#accordion .item a.head").click(function (e) { 

    //open tab when click on item 

    e.preventDefault(); 
    $(this).toggleClass('active'); 
    $(this).next().stop().slideToggle(); 
    if ($(this).hasClass('active')) { 
     $(this).attr('title', 'hide'); 
    } else { 
     $(this).attr('title', 'show'); 
    } 
}); 
$("#accordion .showAll").click(function (e) { 

    //open all tab 

    e.preventDefault(); 
    $("#accordion .item a").each(function() { 
     if (!$(this).hasClass('active')) { 
      $(this).click(); 
     } 
    }); 
}); 
$("#accordion .hideAll").click(function (e) { 

    //hide all tab 

    e.preventDefault(); 
    $("#accordion .item a").each(function() { 
     if ($(this).hasClass('active')) { 
      $(this).click(); 
     } 
    }); 
}); 

$(".backToTop").click(function (e) { 

    //scroll to top 

    e.preventDefault(); 
    $('body, html').animate({ 
     scrollTop: 0 
    }, 450); 
});

基本上它是一個手風琴，很簡單的一個jQuery的做

的jsfiddle這裏： http://jsfiddle.net/PqaXZ/6/ （注*：你必須向下滾動才能看到例子）任何人都可以解釋爲什麼我點擊「Show All」按鈕，它會觸發一個點擊「Ba ck到頂部「按鈕？

我看不到任何東西都不可能導致它在代碼

感謝很多提前

來源

2013-09-22 Keo Strife

因爲你觸發它的點擊。

$("#accordion .item a")包括「全部顯示」按鈕，然後您立即$(this).click();模擬用戶單擊該鏈接。因此，將它們發送回頂部。

來源

2013-09-22 00:15:37 Sinetheta

那麼，在你的「全部顯示」點擊處理程序，你點擊手風琴所有「無效」鏈接：

$("#accordion .item a").each(function() { 
    if (!$(this).hasClass('active')) { 
     $(this).click(); 
    } 
});

如果至少的「返回頂部」鏈接在一個任何地方手風琴沒有「活動」類，您正在觸發其點擊事件。

來源

2013-09-22 00:15:44 David

愚蠢的我！好尷尬！！！ –

由於您使用的是選擇內部空間，它是任何a「點擊」 下的任何.item是下#accordion，其中包括你的「回」的頂部按鈕。如果您改爲選擇：#accordion .item>a，那麼它只會在.item s的直接子女a上「點擊」。

來源

2013-09-22 00:19:36

#accordion .item a被觸發所有內部.item你應該使用

#accordion .item > a

觸發人的第一個鏈接的鏈接，但沒有孩子的

來源

2013-09-22 00:26:21 Carlos

jQuery選擇錯誤

回答

相關問題