拒绝可排序列表中的无效可排序项

我尝试了很多但没有成功的事情:(我有两个相互连接的可排序列表。事情是列表’A’可以接受其中的任何列表项。但是列表’B’只能接受具有class =’abc’的项目

代码是

 
item A1 
item A2 
item A3 
 
 
item A1  

我正在尝试的jquery代码是

 $('#A').sortable({revert: true, connectWith: '#B'}) $('#B').sortable({revert: true, connectWith: '#A', over: function(event, ui){ if(!ui.item.hasClass('abc')){ ui.placeholder.addClass('ui-state-error'); ui.sender.sortable('cancel'); } }}) 

请指导我错在哪里，谢谢

Answer 1

您可以尝试使用receive事件，虽然它有点延迟这样做并且addClass不起作用：

 $('#A').sortable({revert: true, connectWith: '#B'}) $('#B').sortable({revert: true, connectWith: '#A', receive: function(event, ui){ if(!ui.item.hasClass('abc')){ $(ui.placeholder).addClass('ui-state-error'); $(ui.sender).sortable('cancel'); }} })​;​ 

示例 – http://jsfiddle.net/b5ykK/1/