拒絕排序列表中的無效排序項目

Question

我嘗試了很多東西，但不成功:(我有兩個可排序的列表相互連接，事情是列表'A'可以接受任何列表項目，但列表'B'只能接受上課=「ABC」項目

其代碼

<ul id='A'> 
    <li>item A1</i> 
    <li>item A2</i> 
    <li class='abc'>item A3</i> 
</ul> 

<ul id='B'> 
    <li class='abc'>item A1</i> 
</ul> 

我試圖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

你可以嘗試使用，而不是接收事件，雖然這是一個有點延遲做這和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/