Question

我有一个问题需要一个虽然奇怪的解决方法。基本上，我在平板电脑上有一个菜单，需要忽略用户第一次点击/选择链接，但第二次选择后，它会执行链接。

所以说我们在这里有一个关于谷歌的链接： Google.com

如何阻止窗口加载链接，直到第二次点击它为止？这样，如果有子项显示子菜单，则可以单击多个菜单项。

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

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

有可能这样做吗？应该有办法检测点击次数吗？

Answer 1

你可以使用类似的东西：

var clickBtn = false;

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

Fiddle

Answer 2

您可以查看课程说.clicked，如果找到，请点击链接，如果找不到 - 必须是第一次点击 - 请不要点击链接，添加课程clicked ：

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

DEMO

Answer 3

你可以尝试添加一个变量来检测它是否已被点击：

var hasBeenClicked = false;

然后点击它：

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

Answer 4

我会创建一个全局可访问的计数器变量，然后围绕要在该单击函数中运行的内容创建一个if语句，以便它只在您需要时执行。例如：

var counter = 0;

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

希望有所帮助！

Answer 5

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

当用户点击该链接时，请检查该链接元素上是否存在数据属性（让我们说＆＃39;数据点击一次＆＃39;）。如果没有，请将此属性设置为＆＃39; true＆＃39;。如果该属性存在，请执行显示菜单的代码。

$('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（）获取属性时，它始终返回字符串

jQuery - 首次点击时阻止激活

5 个答案: