Jquery-toggle單擊功能，單擊不起作用。 但它可以雙擊

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>

當我單擊span id =“ dropdownArrow”時，我想切換UL。 但它僅在雙擊上切換。 為此編寫的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');
            }
        });
    });
});

單擊事件綁定到文檔和鏈接導致了錯誤。 該鏈接將捕獲該事件，而使文檔一無所有。 由於事件僅關注鏈接，為什么在事件發生時不僅僅處理所有內容？

-大聲晚20分鍾-