jquery - 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/