Question

我在一个可拖动的div中有一个textarea的问题，我不能用鼠标来编辑文本，我必须使用箭头......如何处理这个？

＆＃13;

  $.event.props.push('dataTransfer');

  $('div').on("drag", function (event) {
      event.preventDefault();
  });

  $('div').on("dragstart", function (event) {
      // store a ref. on the dragged elem
      event.dataTransfer.setData('text/plain', null); //moz
      dragged = event.target;
  });

  $('textarea').on("click", function (e) {
      e.preventDefault();
  })

＆＃13;

div {
    width:200px;
    height:200px;
    border:1px solid grey;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div draggable="true">
    <textarea>Hello</textarea>
</div>

＆＃13;

http://jsfiddle.net/1oe43zdL/

Answer 1

您可以根据textarea的mouseenter和mouseleave事件切换拖动功能。

$('textarea').on("mouseenter", function (e) {
      draggable = false;
      $(e.target).parent().attr('draggable', false);
      e.preventDefault();
});

$('textarea').on("mouseleave", function (e) {
      $(e.target).parent().attr('draggable', true);
      e.preventDefault();
});

jsfiddle update

在没有jqueryui的可拖动div中的textarea

1 个答案: