我有一个函数可以在两个列表之间附加一个项目。此外,我还使用函数按字母顺序排序待办事项列表,因此当某个项目移回待办事项列表时,它将按字母顺序重新排序。
问题是,因为我必须在排序期间重新分配 onclick 事件监听器,所以 onclick 函数会创建单击事件的循环 - 这由显示两个单击事件的控制台日志支持。这会导致链接中断,因为双击意味着任务项无法附加到其他 ID。
我已经尝试了一切,但没有成功 - 使用回调函数,使用 .trigger(),使用 .triggerHandler()。我确信我只需要一种方法来阻止事件再次触发。
我的 DOM 如下:
HTML
<div id="todo">
<div class="task">
<div class="c1">B</div>
<a class="swap" href="JavaScript:void(0);">SWAP</a>
</div>
<div class="task">
<div class="c1">A</div>
<a class="swap" href="JavaScript:void(0);">SWAP</a>
</div>
<div class="task">
<div class="c1">C</div>
<a class="swap" href="JavaScript:void(0);">SWAP</a>
</div>
</div>
<div id="done">
</div>
JAVSCRIPT
// initial $('a.swap').on('click', onClick) is assigned in the AJAX
var onClick = function (event) {
// code to swap between lists on click of the a link
// once the item is appended to the other list callback the sort function
sortByName()
}
var sortByName = function () {
var sortbyname = $('#todo').find($(".task")).sort(function (a, b) {
if ($.trim($(a).find(".c1").text()) < $.trim($(b).find(".c1").text())) {
return -1;
} else {
return 1;
}
});
$("#todo").html(sortbyname);
$('a.swap').on('click', onClick) //this is where the problem seems to be
}
如果您能建议如何阻止 onclick 事件再次循环,我们将不胜感激。
非常感谢。
最佳答案
在添加新事件之前,请尝试删除当前事件。
$('a.swap').off('click').on('click', onClick);
关于javascript - jquery Onclick函数与回调排序函数导致双击,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37262356/