jQuery拖放到文本区域
使用jQuery，并希望用户将占位符拖到文本区域。
每个占位符都是 ，其中包含class='placeholder' 。 文本区域id只是'main_text' 。
因此，用户应该能够将每个占位符span拖动到文本区域的顶部，删除它，然后插入文本。
最理想的效果是在放置占位符的位置插入文本，但我几乎放弃了那个。 在这一点上，只是为了让它工作，所以它在任何地方插入文本将是一个良好的开端。
有没有人成功完成这个？ 谢谢 –
我不认为你可以直接使用textarea作为droppable，因此我做了一个小的黑客，在拖动开始直接在textarea上定位div。 div是实际的droppable，然后将draggable的文本插入textarea
点击这里查看演示
http://jsbin.com/egefi(http://jsbin.com/egefi/edit代码）
它插入当前textcaret位置我不认为插入当前鼠标光标位置甚至是可能的。
function insertAtCaret(area, text) { //... adapted from http://www.scottklarr.com/topic/425/how-to-insert-text-into-a-textarea-where-the-cursor-is/ } $(document).ready(function() { var options = { accept: "span.placeholder", drop: function(ev, ui) { insertAtCaret($("textarea#main_text").get(0), ui.draggable.eq(0).text()); } }; $("span.placeholder").draggable({ helper:'clone', start: function(event, ui) { var txta = $("textarea#main_text"); $("div#pseudodroppable").css({ position:"absolute", top:txta.position().top, left:txta.position().left, width:txta.width(), height:txta.height() }).droppable(options).show(); }, stop: function(event, ui) { $("div#pseudodroppable").droppable('destroy').hide(); } }); });