jquery - jQuery droppable が複数の droppable を起動しない

Question

jQuery ドロップ可能を HTML ドキュメントに統合しようとしていますが、何をしようとしても、2 番目のドロップ可能は起動されません。

私の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>

#it​​ems1 から #items2 へのすべてのアイテムのドラッグは機能していますが、#items2 から #items1 へのすべてのアイテムがドロップ イベントを発生させません。

Z-Index の問題ですか、それとも他の問題ですか?

ありがとう！