Jquery-toggle on click функция, не работает на один клик. Но он работает при двойном щелчке

Question

Привет, у меня проблемы с переключением функций, его работа выполняется только при двойном щелчке не на одном клике, так что кто-нибудь может мне помочь в этом.

Ниже мой HTML код:

<div class="search_result_per_page"> 
    <dl class="selectcsdd perpage"> 
    <dt> 
    <a href="javascript:void(0);" rel="nofollow"> 
    <span id="dropdownArrow" class="close">Items per page</span> 
    </a> 
    </dt> 
    <dd> 
    <ul style="display: none;"> 
    <li> 
    <li> 
    <li> 
    </ul> 
    </dd> 
    </dl> 
    </div> 

Я хочу, чтобы переключить UL, когда я нажимаю на поверочного ид = "dropdownArrow". Но он только переключается на двойной щелчок. Код Jquery, написанный для этого, выглядит следующим образом.

$(document).ready(function($) 
     { 
      $(".selectcsdd.perpage dt a").click(function() { 
       $(".selectcsdd.perpage dd ul").toggle(function(){    
      var arrow = $(".selectcsdd.perpage #dropdownArrow").attr('class'); 
       if(arrow=='close'){ 
       $(".selectcsdd.perpage #dropdownArrow").attr('class','open'); 
      } 
      else if(arrow=='open'){ 
       $(".selectcsdd.perpage #dropdownArrow").attr('class','close'); 
      } 
     }); 
    }); 
    $(".selectcsdd.sortby dt a").click(function() { 
     $(".selectcsdd.sortby dd ul").toggle(function(){ 
      var arrow = $(".selectcsdd.sortby #dropdownArrow").attr('class'); 
      if(arrow=='close'){ 
       $(".selectcsdd.sortby #dropdownArrow").attr('class','open'); 
      } 
      else if(arrow=='open'){ 
       $(".selectcsdd.sortby #dropdownArrow").attr('class','close'); 
      } 
     }); 
    }); 

    $(document).bind('click', function(e) { 
     var $clicked = $(e.target); 
     if (! $clicked.parents().hasClass("open")) 
      $(".selectcsdd.perpage dd ul").hide(); 
      $(".selectcsdd.sortby dd ul").hide(); 
    }); 
}); 

Есть идеи?

Answer 1

Вы используете .click() и .bind('click') на одном и том же элементе, который, кажется, вызывает проблему. Если удалить .bind() он работает отлично

Answer 2

Попробуйте это:

$(document).ready(function($) { 

    $(".selectcsdd.perpage dt a").click(function(e) { 
     $(".selectcsdd.perpage dd ul").toggle(function(){    
      var arrow = $(e.target).attr('class'); 
      if(arrow=='close'){ 
       $(".selectcsdd.perpage #dropdownArrow").attr('class','open'); 
      } 
      else if(arrow=='open'){ 
       $(".selectcsdd.perpage #dropdownArrow").attr('class','close'); 
      } 
      if (! e.class == 'open'){ 
       $(".selectcsdd.perpage dd ul").hide(); 
       $(".selectcsdd.sortby dd ul").hide(); 
      } 
     }); 
    }); 
    $(".selectcsdd.sortby dt a").click(function() { 
     $(".selectcsdd.sortby dd ul").toggle(function(){ 
      var arrow = $(".selectcsdd.sortby #dropdownArrow").attr('class'); 
      if(arrow=='close'){ 
       $(".selectcsdd.sortby #dropdownArrow").attr('class','open'); 
      } 
      else if(arrow=='open'){ 
       $(".selectcsdd.sortby #dropdownArrow").attr('class','close'); 
      } 
     }); 
    }); 
}); 

Имея событие щелчка, связанного с документом, и связь была причиной ошибки. Ссылка поймала бы событие и не оставила бы документ ни с чем. Поскольку событие касается только ссылок, почему бы просто не обрабатывать все, когда происходит событие?

--lol 20 минуты late--