jQuery - предотвращение активации при первом нажатии

Question

У меня есть проблема, которая требует хотя бы странного обходного пути. По сути, у меня есть меню на планшете, которому нужно игнорировать пользователя, щелкнув/выбрав ссылку в первый раз, но после его выбора второй раз он выполняет ссылку.

Так что у нас есть ссылка здесь, который идет в Google: Google.com

Как я могу остановить окно с загрузкой ссылку, пока не будет нажата во второй раз? Таким образом можно щелкнуть несколько пунктов меню, если у них есть дети, чтобы показать подменю.

Я посмотрел вокруг и все, я нашел event.stopImmediatePropagation();

Но это игнорирует все события щелчка полностью, что это не то, что мне нужно.

Возможно ли это? Должен быть способ определить количество кликов, конечно?

Answer 1

Вы можете использовать что-то похожее на это:

var clickBtn = false; 

$('#link').click(function(e){ 
    if(clickBtn == false){ 
     e.preventDefault(); 
    } 
    clickBtn = true; 
}); 

Fiddle

Answer 2

вы можете попробовать добавить переменную, чтобы обнаружить, если она была нажата еще:

var hasBeenClicked = false; 

тогда, когда она нажата:

if (hasBeenClicked) { 
    // logic to follow the link 
} else { 
    hasBeenClicked = true; 
} 

Answer 3

Я бы сделал глобально доступную переменную счетчика, а затем сделаю оператор if вокруг того, что вы хотите запустить внутри этой функции щелчка, чтобы он выполнялся только тогда, когда вы хотите. Пример:

var counter = 0; 

example.addEventListener("click", function() { 
    if (counter > 0) { 
     //do action 
    } 
    counter++; 
} 

Надеюсь, что это поможет!

Answer 4

Вы можете проверить класс сказать, .clicked, если найден по ссылке, если не найден - это должно быть первое нажатие - не по ссылке, добавьте класс clicked:

$('.a').on('click', function(e) { 
    if(!$(this).is('.clicked')) { 
     e.preventDefault(); 
     $(this).addClass('clicked'); 
    } 
}); 

DEMO

Answer 5

Одним из способов достижения этого требования является использование атрибутов данных.

Когда пользователь нажимает на ссылку, проверьте, существует ли атрибут данных (допустим, «щелкнул данные один раз») в этом элементе связи. Если нет, настройте этот атрибут на «true». Если атрибут существует, выполните код для отображения меню.

$('a#menu').on('click', function(){ 
    var $a = $(this); 
    if($a.attr('data-clicked-once') === 'true'){ 
     //show the menu 
    }else{ 
     $a.attr('data-clicked-once','true'); 
    } 
}); 

Обратите внимание, что когда вы получаете атрибуты .attr() всегда возвращает строку