jQuery - 防止第一次点击激活

jQuery - Prevent activation on first click

我有一个问题需要一个奇怪的解决方法。本质上,我在平板电脑上有一个菜单,第一次需要忽略用户 clicking/selecting link,但是一旦第二次选择,它就会执行 link.

假设我们这里有一个 link 到 Google: Google.com

如何阻止 window 加载 link 直到它被第二次点击?这样可以单击多个菜单项,如果它们有子项以显示子菜单。

我环顾四周,发现的只有 event.stopImmediatePropagation();

但这完全忽略了所有点击事件,这不是我需要的。

这可以吗?应该有检测点击次数的方法吧?

您可以尝试添加一个变量来检测是否已被点击:

var hasBeenClicked = false;

然后当它被点击时:

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

您可以使用类似这样的东西:

var clickBtn = false;

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

Fiddle

我会制作一个全局可访问的计数器变量,然后在该点击函数中围绕您想要 运行 的内容制作一个 if 语句,以便它仅在您需要时执行。例如:

var counter = 0;

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

希望对您有所帮助!

你可以检查class说,.clicked,如果找到就跟着link,如果没找到——那一定是第一次点击——不要跟着link, 添加 class clicked:

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

DEMO

实现要求的一种方法是使用数据属性。

当用户单击 link 时,检查该 link 元素上是否存在数据属性(假设 'data-clicked-once')。如果不是,请将此属性设置为 '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() 获取属性时,它总是 returns string