如何在单击一次后禁用带有button 类的所有链接？我希望能够在一个地方执行此操作，而不必单独更改所有这些.. 有什么想法吗？
到目前为止，我得到了这个：
$("a.button").click(function() { $(this).attr("disabled", "disabled"); });
$("a[disabled]").click(function() { return false; });
但是第二个事件没有触发..
【问题讨论】：
unbind() 才能删除事件。
标签： javascript jquery
这是我会尝试的：
$("a.button").one("click", function() {
$(this).click(function () { return false; });
});
使用类“按钮”绑定所有链接。只运行一次匿名函数（因此是“one”），它会重新绑定链接以返回 false。
如果你想让它看起来更像你所拥有的，试试这个：
$("a.button").click(function() { $(this).attr("disabled", "disabled"); });
$(document).click(function(evt) {
if ($(evt.target).is("a[disabled]"))
return false;
});
【讨论】：
如果您使用链接，我有一个优雅的解决方案：
function do_nothing() {
return false;
}
// prevent a second click for 10 seconds. :)
$('.prevent_doubleclick').live('click', function(e) {
$(e.target).click(do_nothing);
setTimeout(function(){
$(e.target).unbind('click', do_nothing);
}, 10000);
});
https://github.com/ssoroka/prevent_doubleclick.js
我会尽快添加对表单的支持。
【讨论】：
是的，设置一个值来跟踪这个：
$("a").click(function (){
if( $(this).data("clicked") ){
return false;
}
$(this).data("clicked", true);
return true;
});
【讨论】：
创建一个 JS - 将其包含在每个页面上（如果有的话，也可以包含在您的母版页中。）
我觉得有点像
$(document).ready(function(){
$('.button').click(function(){
$('.button').click(function(e) {
e.preventDefault();
});
});
});
【讨论】：
preventDefault() 比返回 false 好很多
你也可以在锚标签上抛出一个类并检查点击：
$('a.button').click(function(){
if($(this).hasClass('clicked')) return false;
else {
$(this).addClass('clicked');
return true;
}
});
使用该类，您可以在第一次点击后对链接进行一些额外的样式设置。
【讨论】：
这适用于 IE 和 Chrome，锚标签上有 href 和 onclick 属性：
$(document).ready(
function()
{
$('a.button').on("click",
function(event)
{
$('a.button').prop('onclick',null);
$('a.button').removeAttr('href');
});
});【讨论】：
$('a.button').bind('click', function(){
alert('clicked once'); // for debugging
// remove all event handlers with unbind()
// add a new function that prevents click from working
$(this).unbind().bind('click', function(){
alert('clicked a 2nd time or more'); // for debugging
return false;
});
});
【讨论】：
事件仅绑定在 document.ready 上，您应该使用 .live 事件来处理它：
$("a.button").live("click", function() { $(this).attr("disabled", "disabled"); });
$("a[disabled]").live("click", function() { return false; });
【讨论】：
$("a.button").bind('click', function() { $(this).attr("disabled", "disabled"); });
$("a[disabled]").live('click', function() { return false; });
做到了。第一行使用类按钮绑定到所有 a 元素，该函数将（btw 对 a 元素无效）禁用属性设置为禁用。
第二个函数使用 jQuery 实时事件重新绑定来将“禁用”函数绑定到所有具有禁用属性的 a 元素的未来实例
如果需要，请查看jQuery Event documentation 以获取有关这两个使用的功能的更深入信息
【讨论】：
您可能必须禁用表单上的 ajax 提交并处理按钮单击：
$("form").attr("data-ajax", "false");
$("[type='submit']").click(function (e) {
var form = $("form");
if (!this.disabled) {
if (form.valid()) {
this.disabled = true;
form.submit();
}
}
});
【讨论】：
我喜欢亚当提供的解决方案的想法，但这对我不起作用。如果您在点击后无法使用.one() 禁用链接，我建议您尝试以下方法。
$("a.button").bind("click", function( event ) {
// Unbind the click event from anchors with class button
$(this).unbind( event );
});
【讨论】：
我相信您在谈论一个常见问题，您只是不希望一次点击链接/按钮多次。也许您真的不想禁用按钮或链接，您只是想在第一次单击完成之前阻止“再次单击”。
如果您希望在两次点击之间有延迟，可以使用以下选项之一：
//prevent double click
$(document).on('click', ".one-click", function(e){
if($(this).data('lastClick') + 1000 > new Date().getTime()){
e.stopPropagation();
return false;
}
$(this).data('lastClick', new Date().getTime());
return true;
});
接下来需要做的是给按钮或链接一个“一键式”类。
该事件已注册到文档中，它也适用于动态加载的 html。
代码中的1000是一秒的延迟。即在第一次点击的 1 秒内，任何点击都会被忽略。根据需要更改延迟值。
当我想阻止 Bootstrap 模式（已修改并启用 Ajax）多次弹出时，我遇到了这个问题。上述解决方案没有帮助，需要使用 Bootstrap modal 的 'show' 和 'hide' 事件来防止双重弹出。
【讨论】：
$('a.disableAfterOneClick').on('click', function(e){
e.preventDefault(); //disabling default behaviour
if (this.href) //checking if href attr is stil set
{
href = this.href; //saving current href for it will be removed
$(this).removeAttr("href"); //removing href
window.location.href = href; //redirecting user to href
}
});
【讨论】：
我正在使用它来禁用“点击”事件发送两次（而不是“双击”事件）。 适用于 IE>=9、firefox、webkit 或 chrome。 第一次单击事件会在一段时间内禁用按钮/链接/跨度。时间过去后，按钮/链接/跨度被启用，用户可以点击它。
$(document).ready(function() {
/**
* disable double click
**/
document.addEventListener('click', function(event) {
var targetElement = event.target || event.srcElement;
var target = $(targetElement);
var eLink = target.prop("tagName") === 'A'; // hypertext link
var eButton = target.prop("tagName") === 'BUTTON'; // button
var fButton = target.prop("tagName") === 'SPAN' && target.parent().parent().hasClass("fbutton"); // flexigrid buttons
if ( eLink || eButton || fButton ) {
if ( target.data("clicked") ) {
event.stopPropagation();
event.preventDefault();
if ( window.console ) {
console.log("double click event disabled");
}
return false;
} else {
target.data("clicked", true);
target.prop('disabled', true);
target.addClass("clicked");
setTimeout(function() {
target.data("clicked", false);
target.prop('disabled', false);
target.removeClass("clicked");
}, 500); // Do something after 500 millisecondes
return true;
}
}
}, true);
});
【讨论】：
这应该在你使用函数时起作用
var clickRunning = false;
function OpenSth(){
if (clickRunning) return;
clickRunning = true;
yourFunc({
/* do your stuff*/
},500, function () {
clickRunning= false;
});
}
【讨论】：
你总是因为一件小事而大费周章。
第一次点击时设置延迟器自复位变量。这会在一段时间内禁用第二次点击。简单！
var formvar=1;
$('#myForm').submit(function() {
if(formvar==1)
{
$(this).ajaxSubmit(options); // or do what ever normally do
setTimeout(function(){formi=1}, 3000);
formvar=0;
}
else alert("no dbl clicking");
});
【讨论】：