jquery - jQuery droppable 未触发多个 droppable

Question

我正在尝试将 jQuery droppable 集成到我的 html 文档中，但无论我尝试什么，第二个 droppable 都不会被触发。

我的 HTML 是：

<div class="content">
  <div id="items1" class="span2 pull-left">
    <div class="item">

    </div>
    <div class="item">

    </div>
  </div>
  <div id="items2" class="span2 pull-right">
    <div class="item">

    </div>
    <div class="item">

    </div>
  </div>
</div>

我的 jQuery 是：

<script>
            $( ".item" ).draggable({ 
                revert:true,
                start: function(e, ui)
                 {
                  $(ui.helper).addClass("ui-draggable-helper");
                 },
                 helper: function(){
                    $copy = $(this).clone();
                    return $copy;},
                 appendTo: "body"
            });
    $("#items1").droppable({
        accept: ".item",
        drop: function(event, ui) {
            var id = ui.draggable.attr("id");
            var servertype = ui.draggable.attr("servertype");
            if(servertype != "to"){
                copyMail(id,servertype);
            }
        }
    });
    $("#items2").droppable({
        accept: ".item",
        drop: function(event, ui) {
            var id = ui.draggable.attr("id");
            var servertype = ui.draggable.attr("servertype");
            if(servertype != "from"){
                copyMail(id,servertype);
            }
        }
    });
  </script>

将 #items1 中的每个项目拖到 #items2 上是有效的，但从 #items2 到 #items1 的每个项目都不会触发 drop 事件。

是 Z-Index 的问题还是其他问题？

谢谢！