直到连续点击两次，才能预设默认值

我试图阻止菜单中的默认链接点击操作。我使用下面的代码，但是，我注意到，当我点击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

直到连续点击两次，才能预设默认值

回答

相关问题