Question

我正在使用Jquery UI库。我想在单击时给出在可拖动div中写入文本的功能。我想当用户单击div时，光标应该出现，用户可以在其中写入文本。

请使用工作代码示例建议解决方案。

这是示例代码： -

<script>
      $(function() { 
             $( "#dv1" ).draggable();    
         });
</script>

<div id="dv1">
<p>Drag me around</p>
</div>

Answer 1

我进一步建立了Jesse的解决方案，当textarea失去焦点时，将textarea换回一段。这可确保您可以在编辑其内容后拖动div。

查看the fiddle！

Answer 2

您可以在可拖动容器中添加textarea并在点击中显示：

http://jsfiddle.net/GwTt3/

<div id="dv1">
    <p>Drag me around<textarea></textarea></p>
</div>

#dv1 p textarea{
 display: none;   
}

$("#dv1").draggable(); 
$('p').on('click', function(){
   $(this).find('textarea').show(); 
});

另一种选择是动态添加textarea：

http://jsfiddle.net/ZrHHb/

$( "#dv1" ).draggable();

$('p').on('click', function(e) {
   var replace = $(this);    
   var ele = $('<textarea>')
       .val(replace.text())
       .insertAfter(replace);

   replace.hide();    
});

Jquery写在draggable div中

2 个答案: