jquery将联系人拖放到表单字段

Question

我一直在试图弄清楚如何使用jquery从联系人块（作为示例移动号码）拖动项目并将其放入表单域或一个文本区域，然后通过关闭按钮删除它们（有些东西就像添加联系人时的iphone消息）。

您的帮助将不胜感激。

Answer 1

试试这个：

$(function() { 
     $("ul > li").draggable({ 
      appendTo: "body", 
      helper: "clone" 
     }); 
     $("div").droppable({ 
      drop: function(event, ui) { 
       createNode(ui.draggable.text(), $(ui.draggable)) 
       $(ui.draggable).hide(); 

      } 
     }); 
    }); 

    function createNode(text, origNode) { 
    $("div").append(
     $('<span class="node"/>').html(text).append(
      $('<span class="close"/>').click(function() { 
       origNode.show(); 
       $(this).parent().remove(); 
      }).html('x') 
     ) 
    ); 
    } 

演示：http://jsfiddle.net/codef0rmer/G6fmF/