addClass＆removeClass不工作

我有一個菜單，它應該作爲一個點擊菜單，所以當點擊按鈕時會出現一個菜單，當再次點擊該按鈕時，菜單應該消失，但我不能讓它工作？addClass＆removeClass不工作

我有這個腳本

<script type="text/javascript"> 
     $(document).ready(function() { 
     $('#dropdown').click(function(){ 
      setTimeout(function(){ 
       $('#dropdown').attr("id", "dropdown2"); 
       $('#dropmenu').addClass("open"); 
       //$('#dropmenu').fadeIn('fast'); 
      },500); 
     }) 
     $('#dropdown2').click(function(){ 
      setTimeout(function(){ 
       $('#dropdown').attr("id", "dropdown"); 
       $('#dropmenu').removeClass("open"); 
       //$('#dropmenu').fadeIn('fast'); 
      },500); 
     }) 
     }); 
    </script>

添加類時，它的工作原理FINT，但是當IM再次單擊該按鈕，它不會刪除類「打開」

來源

2011-03-31 nuffsaid

爲什麼地球上你在改變ID？ – SLaks 2011-03-31 13:08:30

你寫$('#dropdown').attr("id", "dropdown2");後，第二個處理程序中的代碼沒有#dropdown元素可以匹配。
另外，綁定第二個處理程序時，還沒有#dropdown2元素。（live事件可以解決這個問題）

相反，您應該使用toggle event，它允許您綁定多個將執行每隔一次點擊的多個click處理程序。

例如：

$(document).ready(function() { 
    $('#dropdown').toggle(
     function() { 
      setTimeout(function(){ 
       $('#dropdown').addClass("open") 
           .fadeIn('fast'); 
      }, 500); 
     }, 
     function() { 
      setTimeout(function(){ 
       $('#dropdown').removeClass("open") 
           .fadeOut('fast'); 
      }, 500); 
     } 
    ); 
});

來源

2011-03-31 13:08:19 SLaks

我已經試過了看toggle（）函數，但是看起來似乎不太可能：s – nuffsaid 2011-03-31 13:13:05

嗯，它不會添加類？ – nuffsaid 2011-03-31 13:19:18

它應該添加類。你等了半秒鐘？ – SLaks 2011-03-31 13:21:32

它不工作的原因是，當你註冊單擊處理dropdown2 ID不會退出。你可以用它來克服這個問題，但最好用類：

$(document).ready(function() { 
    $('#dropdown').click(function(){ 
     if (!$(this).hasClass("open")) { 
      setTimeout(function(){ 
       $('#dropmenu').addClass("open"); 
      //$('#dropmenu').fadeIn('fast'); 
      },500); 
     } else { 
     setTimeout(function(){ 
      $('#dropmenu').removeClass("open"); 
      //$('#dropmenu').fadeIn('fast'); 
     },500); 
     } 
    }) 
    });

來源

2011-03-31 13:12:54 kgiannakakis

仍然不會與這:( – nuffsaid 2011-03-31 13:14:39

我更新了上面的代碼，對我有用。請試試這個，

$(document).ready(function(){ 
    $("#loginlink").click(function(){ 
     $('.container .col-sm-6 ul li .dropdown-menu').first().toggle(
      function() { 
       setTimeout(function(){ 
        $('.container .col-sm-6 ul li').first().addClass("open").fadeIn('fast'); 
       }); 
      } 
     ); 
     if(("#loginformstarthere").length){ 
      $(".container .col-sm-6 ul li .dropdown-menu").first().append("hello"); 
    } 

});

來源

2016-06-27 05:23:55

addClass＆removeClass不工作

回答

相關問題