防止 jQuery one() 函数上的点击跳转

发布于 2024-10-20 04:23:24 字数 342 浏览 4 评论 0原文

我在 jQuery 中使用 one() 函数来防止多次点击。但是，当他们第二次单击该元素时，它会执行恼人的单击跳转并将您带回页面顶部。

有没有办法防止这种情况发生？取消绑定点击并在函数完成后重新绑定它具有相同的结果（并且我假设 one() 只是取消绑定事件）。

发生这种情况的一个简单示例： http://jsfiddle.net/iwasrobbed/FtbZa/

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

何其悲哀 2024-10-27 04:23:24

我不确定这是否更好，但您可以绑定一个简单的函数来维护返回 false。

jQuery 通过 .bind('click',false) 提供了一个快捷方式。

$('.someLink').one('click', function() {
    $(this).bind('click',false);
    return false;
});

或者如果您有多个这样的链接，一个非常有效的替代方法是使用 delegate()^[docs]方法将处理程序绑定到共同祖先，该祖先为您处理 return false; 。

在这里，我只使用了 body，但您可以使用更近的祖先。

$('.someLink').one('click', function() {
});

$('body').delegate('.someLink','click',function(){return false;});

I'm not sure if this is better or not, but you could bind a simple function that maintains the return false.

jQuery provides a shortcut for this with .bind('click',false).

$('.someLink').one('click', function() {
    $(this).bind('click',false);
    return false;
});

or if you have several of these links, a very efficient alternative would be to use the delegate()^[docs] method to bind a handler to a common ancestor that takes care of the return false; for you.

Here I just used the body, but you could use a nearer ancestor.

$('.someLink').one('click', function() {
});

$('body').delegate('.someLink','click',function(){return false;});

回复收藏 0 原文

疾风者 2024-10-27 04:23:24

尝试更改 href，以便不使用“#”： http://jsfiddle.net/FtbZa/1 /

$('.someLink').one('click', function() {
    alert('test');
    return false;
}).attr('href', 'javascript:void(0);');

Try changing the href so the '#' isn't being used: http://jsfiddle.net/FtbZa/1/

$('.someLink').one('click', function() {
    alert('test');
    return false;
}).attr('href', 'javascript:void(0);');

回复收藏 0 原文

一杯敬自由 2024-10-27 04:23:24

您可以使用标准的 .click() 函数和一些逻辑：

1. $('.someLink').click(function(event) {
2.     event.preventDefault();
3.     if (!$(this).hasClass("clicked"))
4.         alert('This will be displayed only once.');
5.         $(this).addClass("clicked");
   });

Listen任何具有 .click()< 类的 someLink 的内容/a>
停止浏览器执行其通常执行的操作。
检查对象是否具有类clicked（注意这可以是您想要的任何名称）
它还没有这样做。
添加类clicked，以便下次单击时，它将忽略您的代码。

请在此处查看演示

You could use the standard .click() function and a little logic:

1. $('.someLink').click(function(event) {
2.     event.preventDefault();
3.     if (!$(this).hasClass("clicked"))
4.         alert('This will be displayed only once.');
5.         $(this).addClass("clicked");
   });

Listen to anything with the class someLink for a .click()
Stop the browser doing what it would normally do.
Check if the object has the class clicked (Note this could be any name you wanted)
It hasn't so do something.
Add the class clicked so next time its clicked, it will ignore your code.

See the demo here

回复收藏 0 原文