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>

从＃items2上的＃items1拖动每个项目都可以，但是从＃items2到＃items1的每个项目都不会触发放置事件。

Z索引有问题还是其他问题？

谢谢！