div onclick切換需要兩次點擊

我有以下一塊jquery，它在點擊時切換div。我的問題是它首先需要兩次點擊才能顯示div，然後按預期切換div。我究竟做錯了什麼？感謝您的建議。div onclick切換需要兩次點擊

<script type="text/javascript"> 
    $(function() { 
     $("#clickme").click(function(e) { 
      e.preventDefault(); 
      var categories = $("#categories"); 
      if (!categories.data("loaded")) { 
       categories.load("/categories"); 
       categories.data("loaded", true); 
      } 
      categories.slideToggle("fast"); 
     }); 
    }); 
    </script>

來源

2013-09-27 user2708058

如果刪除if代碼塊，會發生什麼情況？ – j08691

我想最有可能是因爲#categories div之前沒有隱藏，它沒有內容。所以，當你第一次加載它會加載數據，但你立即做一個slideToggle，所以div的狀態被切換，它變得隱藏，你不再做一個負載，第二次點擊實際上他們再次切換，並使其可見。也使用負載回調，並最初隱藏div。

例：

#categories{ 
    display:none; 
}

和

$(function() { 
     //if you dont want to specify css then do this first up. 
     $("#categories").hide(); 
     //now your click event 
     $("#clickme").click(function(e) { 
      e.preventDefault(); 
      var categories = $("#categories"); 

      if (categories.data("loaded")) { 
       categories.slideToggle("fast"); 
       return; 
      } 

      categories.load("/categories", function(){ 
       categories.data("loaded", true).slideDown("fast"); 
      }); 
     }); 
    });

注意的slideToggle切換的div的當前狀態，如果是可見的，沒有內容，它仍然隱藏在第一次點擊

你的問題在這裏很好地演示了Demo-Issue

，你可以修復，通過Demo-Fix

來源

2013-09-27 15:04:25 PSL

完美，顯示：無;做到了。非常感謝你！ – user2708058

也許在開始的股利是可見的（沒有內容）。第一次單擊時，它加載內容但隱藏內容（slideToggle）第二次單擊時，內容已加載，其顯示內容爲slideToggle。

來源

2013-09-27 15:10:15 Pipe

完美，顯示：無;做到了。非常感謝你！ – user2708058

我的情況發生了什麼，即使隱藏需要第一次切換的div 2點擊次數。

<div id="wholeinf1_<?php echo $res['userid']; ?>" style="height:auto; width:auto; display:none;"> 
<div id="wholeinf_<?php echo $res['userid']; ?>" style="height:auto; width:auto;"></div> 
</div> 


<script type="text/javascript"> 
    $('.other_chart').live("click",function(){ 
     //e.preventDefault(); 
     var userid2= $(this).attr("id").split('_').pop(); 
     $.ajax({ 
     type: "POST", 
     async: false, 
     url: "index.php", 
     data: "userid="+ userid2, 
     cache: false, 
     //beforesend: function(){$(".podar").show();}, 
     success: function(html) { 
       //$("#loader_"+userid1).hide(); 
       $("#wholeinf1_"+userid2).toggle(); 
        $("#wholeinf_"+userid2).empty().append(html); 
      } 
     }); 
    }); 
</script>

我做了這是怎麼回事，我就把這將觸發外部門的數據加載到另一個DIV &股利。這對我來說很順利。

我想這對未來幾年的人會有幫助。

來源

2017-08-05 15:57:35

div onclick切換需要兩次點擊

回答

相關問題