为点击功能制作一个循环?

时间:2017-03-30 20:01:27

标签: javascript jquery

我试图使以下函数不断作为循环工作,因为它是控制手风琴中的打开面板但我似乎只能运行一次这个函数来将类添加到初始点击元素(在第一次单击)并再次在单击手风琴中的另一个面板时从元素中删除该类(在第二次单击时)。那么它不再使用click函数添加或删除类?请帮忙,我对这一切都很陌生!感谢

$(document).ready(function() {
  $('dt').click(function() {
    //alert( "Handler for .click() called." );

    $(this).next().andSelf().addClass('.openAcc');
    $('dt').click(function() {
      $('dt').next().andSelf().removeClass('.openAcc');

    });
  });
});

基本上我希望能够点击手风琴中的任何dt元素并打开或关闭前一个/当前的手风琴类

2 个答案:

答案 0 :(得分:3)

您在点击的每个时间添加新的点击处理程序,它们将同时处于活动状态,一个将撤消另一个的效果,等等。

在同一事件的处理程序中分配事件处理程序时,这通常是一个不好的迹象。

事实上,jQuery对你想要的东西有一个很好的功能:toggleClass

$(document).ready(function (){
    $('dt').click(function() {
        $(this).next().andSelf().toggleClass('.openAcc');
    });
});

答案 1 :(得分:1)

您可以删除所有.openAcc类,然后将其添加到当前类中,而不是担心循环。

$(document).ready(function (){
    $('dt').click(function() {
    //alert( "Handler for .click() called." );

        $('.openAcc').removeClass('.openAcc');
        $(this).next().andSelf().addClass('.openAcc');

    });
});

在@squint的帮助下优化代码