与Stackoverflow users help我现在有链接，单击时会淡出:
<!DOCTYPE html>
<html>
<head>
<style>
a.toggle {
color:#3E6D8E;
background-color: #E0EAF1;
border-bottom: 1px solid #3E6D8E;
border-right: 1px solid #7F9FB6;
padding: 3px 4px 3px 4px;
margin: 2px 2px 2px 0;
text-decoration: none;
font-size: 90%;
line-height: 2.4;
white-space: nowrap;
}
a.toggle:hover {
background-color: #e7540c;
color: #E0EAF1;
border-bottom: 1px solid #A33B08;
border-right: 1px solid #A33B08;
text-decoration: none;
}
a.filter {
color:#3E6D8E;
background-color: #E0EAF1;
border-bottom: 1px solid #3E6D8E;
border-right: 1px solid #7F9FB6;
padding: 3px 4px 3px 4px;
margin: 2px 2px 2px 0;
text-decoration: none;
font-size: 90%;
line-height: 2.4;
white-space: nowrap;
}
a.filter:hover {
background-color: #3E6D8E;
color: #E0EAF1;
border-bottom: 1px solid #37607D;
border-right: 1px solid #37607D;
text-decoration: none;
}
</style>
<script src="http://code.jquery.com/jquery-1.4.4.js"></script>
<script>
$(document).ready(function () {
$('a.toggle').click(function () {
$(this).prev().andSelf().fadeOut('fast');
});
});
</script>
</head>
<body>
<p>Please click on
<a class="filter" href="?filter=1">Tag 1</a><a class="toggle" href="/?toggle=2">X</a></p>
<p>Please click on
<a class="filter" href="?filter=2">Tag 2</a><a class="toggle" href="/?toggle=2">X</a></p>
</body>
</html>
但我现在遇到了新问题，当“X”链接被点击后它开始淡出，然后它仍然可以被再次点击，这对我的脚本来说是不利的——因为“X”不应该完全删除“标签”，但只需将其移动到隐藏部分下方，如您在此屏幕截图中所见。然后随后的点击应该将其移回:
请问我怎样才能阻止后续点击？
我可能应该调用 $(this).prev().andSelf().fadeOut('fast').attr('href', XXX); ？但是这里的新值应该是什么？
谢谢!亚历克斯
最佳答案
与 Mike 所说的类似，但是不用担心解除绑定(bind)，让 jQuery 为您完成:
$('a.toggle').one("click", function () {
$(this).prev().andSelf().fadeOut('fast');
});
这意味着该函数将触发一次，然后自行解除绑定(bind)。
关于javascript - jQuery:点击的链接应该淡出，不接受进一步的点击，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/4519619/