Question

我有2个可排序的列表（＃sortable1和＃sortable2），我制作了2个click()函数来处理每个可排序的项目点击事件（$("#sortable1 li").click(function(){})和$("#sortable2 li").click(function(){})）。

我将＃sortable1（例如：Sort1 Item 2）列表中的1个项目移动到＃sortable2 list。问题是当项目移动到＃sortable2并且我尝试单击它时，触发的鼠标事件是$("#sortable1 li").click(function(){})而不是$("#sortable2 li").click(function(){})。

任何建议如果我将项目从sortable1移动到sortable2并单击该项目，项目会触发$("#sortable2 li").click(function(){})？

DEMO ：http://jsfiddle.net/yosafatade/zX3pX/12/

Answer 1

您需要使用on()查看更新http://jsfiddle.net/zX3pX/13/

Answer 2

我会使用.on，因为.delegate已被取代。这样您就可以将事件附加到列表而不是列表项。

使用此：

$("#sortable1").on("click", "li", function(){
        $("#testClickSort1").html($(this).html());
});

$("#sortable2").on("click", "li", function(){
        $("#testClickSort2").html($(this).html());
});

小提琴：http://jsfiddle.net/qkCcS/

Answer 3

我可能会为它所在的表中的每个li项添加一个类。例如

<li class='sort1'></li>

然后当您在.click上检查$(".sort1")以及何时移动项目

$(this).removeClass("sort1");
$(this).addClass("sort2");

jQuery UI可排序点击事件

3 个答案: