jQuery交换元素内容会导致Type F错误。

Question

根据我在这里的另一个帖子，我更新了JS Fiddle 代码

     $(".drop-container").droppable({
    activeClass: "ui-state-highlight",
    //accept: "#mykeys ul li",
    accept:"#mykeys ul li, .drop-container li",
    //connectWith: ".drop-container",
    drop: function( event, ui ) {
         var cid=ui.draggable.attr("id");
         var from_id=ui.draggable.parent().attr('id');       
         if(typeof from_id != 'undefined'){

            var editor = $('#'+cid);  //put your ids here
            var viewer = $('#'+from_id);

            editorContent = editor.clone();
            viewerContent = viewer.clone();

            editor.replaceWith(viewerContent);
            viewer.replaceWith(editorContent);

         }
         $(this).empty();
         //append the draggable onto this
        $(ui.draggable).appendTo(this);
    },
    out: function( event, ui ) {
        var oid=$(ui.draggable).attr("id");
        console.log('dragged out '+oid);
        var from= $(this).closest(".drop-container").attr("id");
        //console.log('from '+ from);               
    }
   });

我要做的是在拖动容器之间时交换内容。但是我死活无法正确地实现它。希望你能帮忙。

当你查看代码时，你会发现你可以从列表中拖放到容器中，然后你可以在容器之间拖放。

我的目标是，如果你将内容放入已有内容的容器中，它会自动将当前内容与新内容进行交换，这几乎类似于可排序的功能。但是我不知道如何将可排序功能应用到我所拥有的结构上。

- Ricky Mataka

---

什么是“类型 F 错误”？ :) - Ram

http://screencast.com/t/x9YRXrlN - 我不知道，但我只是试图让元素在容器之间交换对象。因为在我正在构建的UL结构中，我无法使sortable正常工作。 - Ricky Mataka

是的，它说f变量是未定义的，是一种类型错误。 - Ram

是的，我知道，但这是由jquery.ui抛出的。 - Ricky Mataka

Answer 1

我已经分叉并更新了您的JSFiddle到一个可工作的版本。

更改如下：

• 在.drop-container跨度中添加了ID
• :drop回调：将accept: "#mykeys ul li",更改为accept: "#mykeys ul li, .drop-container li",，因为被拖放的元素不再在#mykeys中
• :drop回调：添加了source_element和existing_element，以便我们可以获取源和目标，并交换.tree列表中的项目

- Maksida