Как активировать подменю только с одним щелчком мыши

Question

Я хочу сделать следующее для меню на мобильных устройствах: На одном щелчке дети должны опускаться. Но при двойных щелчках он должен забрать меня прямо на его страницу. Например. У элемента есть дети, и у меня также есть ссылка, которая выводит меня на страницу. Если я нажму на него, подпункт должен отображаться как элементы блоков. Но если я дважды щелкнул, он должен был взять меня прямо по ссылке (в данном случае на страницу About).

Я попытался это:

$(document).ready(function(){    
    var clicks = 0; 
    $("ul#primary > li.menu-item-has-children").click(function(e) { 
    clicks++; 
    if(clicks === 1) 
    { 
     e.preventDeafult(); 
     $("ul#primary > li.menu-item-has-children ul.sub-menu").css("display","block"); 
    } 
    else if(clicks > 1) { 
     window.location($(this).attr("href"));  
    }     
    }); 
}); 

Видимо, заявление еще выполняется. Но когда я нажимаю в первый раз, подменю не отображается.

Я также попытался использовать slideToggle() вместо свойства css, но он не работает. К сожалению, сайт по-прежнему находится на тестовом домене и защищен паролем, поэтому я не могу вставить ссылку здесь. Надеюсь, вы сможете помочь.

Answer 1

var DELAY = 700, clicks = 0, timer = null; 
 
    $("p").dblclick(function(e){ 
 
     e.preventDefault(); //cancel system double-click event 
 
    }).click("click",function(){ 
 
    
 
clicks++; //count clicks 
 

 
     if(clicks === 1) { 
 

 
      timer = setTimeout(function(e) { 
 

 
       alert("Single Click"); //perform single-click action  
 
       clicks = 0;    //after action performed, reset counter 
 

 
      }, DELAY); 
 

 
     } else { 
 

 
      clearTimeout(timer); //prevent single-click action 
 
      alert("Double Click"); //perform double-click action 
 
      clicks = 0;    //after action performed, reset counter 
 
     } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<p>Double-click or click.</p>

Вам нужно нажать и DblClick событие, как, как показано ниже, чтобы сделать вашу работу.
Внутри события мыши, вы можете установить таймер для повышения его больше, пожалуйста, обратитесь уже ответил на вопрос @Jquery bind double click and single click separately

$(document).ready(function(){    

      $("ElementToBEClicked").click(function(e) { 
       //Expand here your menu   

      }).dblclick(function(e){ 
       //Redirect to URL on double click 
      }); 
     }); 

Update:

<p>Double-click or click.</p> 


var DELAY = 700, clicks = 0, timer = null; 
    $("p").dblclick(function(e){ 
     e.preventDefault(); //cancel system double-click event 
    }).click("click",function(e){ 

clicks++; //count clicks 

     if(clicks === 1) { 

      timer = setTimeout(function(e) { 

       alert("Single Click"); //perform single-click action  
       clicks = 0;    //after action performed, reset counter 

      }, DELAY); 

     } else { 

      clearTimeout(timer); //prevent single-click action 
      alert("Double Click"); //perform double-click action 
      clicks = 0;    //after action performed, reset counter 
     } 
});