我的问题与使用jQuery禁用链接/点击事件有关,它可能比我看起来更容易。我评论了重要的代码,使其更容易。
我在.js文件中有以下代码:
$('.delete-answer').click(function(event) {
event.preventDefault();
// some actions modifying the tags
$('.output').closest('li').remove();
var idMsg = ...;
var action = ...;
var answers = ...;
$(this).closest('li').children('p').remove();
$(this).closest('.tr').before('<tr><td><div class="output">Deleting message...</div></td></tr>');
$(this).closest('.tr').remove();
// While the servlet is deleting the message, I want to disable the links
// but I can't, so my problem is just here
// METHOD 1
//$('a').unbind('click');
// METHOD 2
//$('a').bind('click', function(e){
// e.preventDefault();
//});
$.post("../app/ForumCampus", {action:action, idMsg:idMsg}, function(data) {
});
// METHOD 1
//$('a').bind('click');
// METHOD 2
//$('a').unbind('click');
$('.output').empty();
$('.output').append('Message deleted successfully.');
});
在我的HTML中,我有一些列表项目如下:
<li>
<p class="text">Some text.</p>
<table class="answer-details" style="width: 100%">
<tbody>
<tr class="tr">
<td style="width: 50%;">
<div class="msg-modification" display="inline" align="right">
<a id="modify" class="delete-answer" href="#">Delete</a>
</div>
</td>
</tr>
</tbody>
</table>
</li>
如您所见,我尝试了两种方法来禁用click事件:
方法1:我尝试了以下方法:how to unbind all event using jquery
结果:它工作正常,使用delete-answer类解除来自锚点的click事件,但是:
1)它仅使用delete-answer类停用锚点。我希望在servlet正在执行此操作时禁用所有链接。
2)我不能(或者我不知道如何)重新启用链接。
方法2:我尝试了以下方法:How do I dynamically enable/disable links with jQuery?
结果:它适用于普通锚点,但不适用于具有类delete-answer的锚点。
两者似乎都不相容,所以我真的感谢一些帮助。
注意:还尝试更改类:$('.delete-answer').addClass('delete-disabled').removeClass('delete-answer');
它改变了类并且仅使用删除禁用类离开锚点,但是当我再次单击它们时,它们仍然在删除消息而我不知道原因:/
答案 0 :(得分:2)
使用以下代码执行此操作:
$('a').bind('click', false);
答案 1 :(得分:2)
在函数中包装所有代码并使用标志。
在顶部添加:
(function() {
在底部添加:
})();
在上面的顶行下方,添加:
// Flag for whether "delete answer" is enabled
var deleteAnswerEnabled = true;
在您的点击处理程序中,位于顶部:
if (!deleteAnswerEnabled) {
return false;
}
将您的post
更改为:
// Disable deleting answers while we're doing it
deleteAnswerEnabled = false;
$.post("../app/ForumCampus", {action:action, idMsg:idMsg}, function(data) {
// Enable it again now we're done
deleteAnswerEnabled = true;
});
将所有这些结合在一起:
// (1)
(function() {
// (3)
// Flag for whether "delete answer" is enabled
var deleteAnswerEnabled = true;
$('.delete-answer').click(function(event) {
event.preventDefault();
// (4)
// Don't do it if we're disabled
if (!deleteAnswerEnabled) {
return false;
}
// some actions modifying the tags
$('.output').closest('li').remove();
var idMsg = ...;
var action = ...;
var answers = ...;
$(this).closest('li').children('p').remove();
$(this).closest('.tr').before('<tr><td><div class="output">Deleting message...</div></td></tr>');
$(this).closest('.tr').remove();
// (5)
// Disable deleting answers while we're doing it
deleteAnswerEnabled = false;
$.post("../app/ForumCampus", {action:action, idMsg:idMsg}, function(data) {
// Enable it again now we're done
deleteAnswerEnabled = true;
});
$('.output').empty();
$('.output').append('Message deleted successfully.');
});
// (2)
})();
如果你感觉有足够的偏执,你可能会使用计数器而不是布尔值,但概念是相同的。
答案 2 :(得分:1)
定义一个跟踪删除状态的单独变量:
var isDeleting = false;
$('.delete-answer').click(function(event) {
if (!isDeleting) {
isDeleting = true;
$.post("../app/ForumCampus", {action:action, idMsg:idMsg}, function(data) {
isDeleting = false;
});
}
});
此外,如果锚点实际上不包含URL,则不需要锚点内的href
属性。完全删除它。
答案 3 :(得分:0)
另一个简单的解决方案就是.hide()/ .show()你的点击元素。
答案 4 :(得分:0)
由于我不能发表评论,这是Noob关于Darm帖子(LINK)的问题的解决方案。
我认为如果两个 .binds 用于同一个元素,该页面会使用首先实施的 .bind 。因此,如果您要将设置从 FALSE 更改为 TRUE ,则必须首先 .unbind 即可。要重新启用该单击,请将后一个代码添加到您想要重新启用它的任何功能/事件中。
停用强>
$('a').bind('click', true);
<强>重新启用强>
$('a').unbind('click', false);
$('a').bind('click', true);`
ALSO ,我不知道为什么,设置回 TRUE 将不起作用,除非我包含“jquery-ui.js ”
希望这有帮助