Question

我尝试了很多东西但没有成功:(我有两个相互连接的可排序列表。事情是列表'A'可以接受其中的任何列表项。但是列表'B'只能接受具有class =的项目'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

您可以尝试使用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/

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

1 个答案: