直到連續點擊兩次，才能預設默認值

我試圖阻止菜單中的默認鏈接點擊操作。我使用下面的代碼，但是，我注意到，當我點擊Link 1，然後Link 5，然後返回到Link 1時，會發生默認操作。直到連續點擊兩次，才能預設默認值

<ul class="menu"> 
    <li><a href="page1.html">Link 1</a> 
     <ul> 
      <li><a href="page2.html">Link 2</a></li> 
      <li><a href="page3.html">Link 3</a></li> 
      <li><a href="page4.html">Link 4</a></li> 
     </ul> 
    </li> 
    <li><a href="page5.html">Link 5</a></li> 
</ul>

JS：

$(".menu a").one("touchstart, click", false);

我想要做的是這樣的：

防止默認動作
如果其它菜單item元素被點擊，爲第一個元素重置.one()，所以當它再次被點擊時，默認動作在進行第二次連續點擊之前不會立即發生。

來源

2016-02-20 user387990

如果我理解你很好，這意味着一個click事件將永遠不會成功執行。因爲您每次都阻止默認操作 –

否，單擊同一元素兩次（連續）會允許默認行爲。單擊一個元素，然後再單擊另一個元素，然後返回到第一個元素將防止默認。 – user387990

像這樣Example

$(document).ready(function(){ 

    var lastClicked; 

    $(".menu a").on("touchstart click", function(e){ 

    if(lastClicked!==$(this).attr('href')){ 
     e.preventDefault(); 
     lastClicked=$(this).attr('href'); 

    } 


    }); 
});

來源

2016-02-20 01:53:35

編輯你的代碼之前downvotes洪水 –

請注意，我只在'link3'和'link4'設置真正的'hrefs' –

您的解決方案確實工作，但我注意到移動設備上的一些問題，讓子菜單先顯示單擊。更多的JS和CSS類可以照顧。或者，數據屬性解決方案也可以工作，無需額外的JS和CSS。感謝您提供此解決方案。 – user387990

使用數據屬性，設置臨時值。

例意識形態：

<a href="page1.html" data-proceed="false">Link 1</a> 
<a href="page2.html" data-proceed="false">Link 2</a> 

$('a').click(function(e) { 
    $('a').not(this).attr('data-proceed', 'false'); // reset to false for all other links. Use classes as per your requirement 
    if($(this).attr('data-proceed')==='false') 
    { 
     e.preventDefault(); // if this is the first time 
     $(this).attr('data-proceed', 'true'); // so that from the next click it will proceed 
    } 
});

來源

2016-02-20 01:57:01

但當然你知道它會影響頁面上的每個'a'標籤嗎？ – lupatus

@lupatus：OP需要按照他/她的要求使用選擇器類，這只是他/她理解的示例意識形態。 –

謝謝。這似乎運作良好。是的，我正在使用更有針對性的選擇器。 – user387990

直到連續點擊兩次，才能預設默認值

回答

相關問題