兩個jquery函數一起工作點擊，但一起

所以，當我點擊一次它做的兩個Jquery代碼...我想它，當我點擊它滑下來，並保持下去，直到我再次點擊，如何？兩個jquery函數一起工作點擊，但一起

我試過click1和click2但它不理想。我也試着給他們其他的ID，但它不合邏輯。

<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 
<script> 
$(document).ready(function(){ 
    $("#flip").click(function(){ 
     $("#panel").slideDown(1500); 
    }); 
}); 
</script> 

<script> 
$(document).ready(function(){ 
    $("#flip").click(function(){ 
     $("#panel").slideUp(1500); 
    }); 
}); 
</script> 


<style> 
#panel, #flip { 
    padding: 5px; 
    text-align: center; 
    background-color: #e5eecc; 
    border: solid 1px #c3c3c3; 
} 

#panel { 
    padding: 50px; 
    display: none; 
} 
</style> 
</head> 
<body> 

<div id="flip">Click to slide down panel</div> 
<div id="panel">Hello world!</div> 

</body> 
</html>

來源

2016-12-30 Abdulrahman Algarni

$(document).ready(function(){ 
    $("#flip").click(function(){ 
     if($('#panel').is(':visible')){ 
      $("#panel").slideUp(1500); 
     }else{ 
      $("#panel").slideDown(1500); 
     } 
    }); 
});

來源

2016-12-30 21:58:52

正如你所看到的，當你連接多個處理程序都運行在同一時間。相反，請附加一個處理程序並改爲撥打slideToggle()。

另請注意，您可能需要在該處添加對stop()的調用，以便在快速單擊該元素時，動畫不會排隊。試試這個：

$(document).ready(function() { 
 
    $("#flip").click(function() { 
 
    $("#panel").stop(true).slideToggle(1500); 
 
    }); 
 
});

#panel, 
 
#flip { 
 
    padding: 5px; 
 
    text-align: center; 
 
    background-color: #e5eecc; 
 
    border: solid 1px #c3c3c3; 
 
} 
 
#panel { 
 
    padding: 50px; 
 
    display: none; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="flip">Click to slide down panel</div> 
 
<div id="panel">Hello world!</div>

來源

2016-12-30 21:59:48

這是一個比我的更好的解決方案。 –

的問題是，有綁定到div兩個click事件。相反，您需要跟蹤狀態（即isUp或isDown）並使用一個單擊處理程序執行此操作。像這樣：

$(document).ready(function(){ 
    var isDown = false; 
    $("#flip").click(function(){ 
     if(!isDown){ 
      $("#panel").slideDown(1500); 
      isDown = true; 
     } else { 
      $("#panel").slideUp(1500); 
      isDown = false; 
     } 
    }); 
});

來源

2016-12-30 22:01:18

兩個jquery函數一起工作點擊，但一起

回答

相關問題