事件僅在點擊兩次時激活

我正在使用jQuery在我的HTML頁面上隱藏/顯示側欄。當按下<li>元素時，.toggle("slide")事件將被激活。事件僅在點擊兩次時激活

<div class="sidebar" id="SideBar"></div> 

<!-- elsewhere in code... --> 
<li style="//Styling li Button." id="toggle-bar" onclick="toggleEvent();">toggle bar</li>

{ 
    $("#toggle-bar").click(function(){ 
     $("#SideBar").stop().toggle("slide"); // for left to right slide. 
    }); 
}

我用.stop()一個滑動作用之後停止動畫但動畫僅發生在當用戶第一次聚焦<li>元件上（通過點擊它）。然後再次點擊觸發的動畫（I」中號假設）

那麼，請告訴我如何只有在點擊

來源

2016-03-07 Source Code

你已經錯過了'函數toggleEvent（）'從你的JS代碼，或者你真的把它放在一個匿名對象？ –

我有點困惑，爲什麼你正在使用的HTML onclick和jQuery的.click()一起在相同的元素。

我會建議從html中刪除onclick並刪除.stop()調用，然後您的動畫被調用一次，而不是兩次。正如其他評論所述，最好知道function toggleEvent()是什麼，以便我們能夠提供更準確的答案。

您的HTML：

<div class="sidebar" id="SideBar"></div> 

<!-- elsewhere in code... --> 
<li style="//Styling li Button." id="toggle-bar">toggle bar</li>

您的javascript：

$("#toggle-bar").click(function(){ 
    $("#SideBar").toggle("slide"); // for left to right slide. 
});

，或者如果您需要function toggleEvent()去運行，你的JavaScript可以關注一下：

$("#toggle-bar").click(toggleEvent);

來源

2016-03-07 10:52:00

謝謝兄弟。幾分鐘後，我張貼這個。我意識到爲什麼我使用了兩次「onclick」。 –

假設你已經證明了JS代碼是toggleEvent()函數的代碼塊，像下面的觸發動畫：

function toggleEvent() { 
    $("#toggle-bar").click(function(){ 
     $("#SideBar").stop().toggle("slide"); // for left to right slide. 
    }); 
}

問題是，在第一次點擊附加事件處理程序的元素上。然後在隨後的點擊中附加另一個事件處理程序，並運行以前的任何處理程序。這就是爲什麼它只在第一次點擊後才起作用。

要達到您的要求，您可以完全刪除onclick屬性並直接通過JS附加您的事件處理程序。試試這個：

<li style="" id="toggle-bar">toggle bar</li>

$(function() { 
    $("#toggle-bar").click(function(){ 
     $("#SideBar").stop().toggle("slide"); // for left to right slide. 
    }); 
});

來源

2016-03-07 10:49:08

事件僅在點擊兩次時激活

回答

相關問題