Angular-drag-and-drop-lists：具有可拖动属性的输入导致 IE 中出现意外行为答案

【问题标题】：Angular-drag-and-drop-lists: Inputs with draggable property causing unintended behavior in IEAngular-drag-and-drop-lists：具有可拖动属性的输入导致 IE 中出现意外行为
【发布时间】：2016-05-03 18:50:50
【问题描述】：

我正在使用 Angular 拖放列表。在 Windows 8 上使用 IE 11 时，我注意到以下错误：

我必须双击才能开始输入
“x”（ms-clear）实际上并没有做任何事情
我无法突出显示文本。

这在 Chrome 中运行良好，在 IE 和 Chrome 中尝试以下演示： http://marceljuenemann.github.io/angular-drag-and-drop-lists/demo/#/types

有人知道官方修复或解决方法吗？

【问题讨论】：

标签： javascript angularjs drag-and-drop

【解决方案1】：

所以我想出了一个解决方案来修复我的特定用例，但我很想看看其他人是如何处理这个问题的。

<div class="form-group">
  <div class="row"dnd-list="application.ApplicationFields">
    <div class="col-xs-3" ng-repeat="field in application.ApplicationFields" dnd-draggable="field" dnd-effect-allowed="move" dnd-moved="application.ApplicationFields.splice($index, 1);" dnd-horizontal-list="true">
      <div class="field-group">
        <label class="control-label">Test</label>
          <input dnd-nodrag type="text" ng-mouseenter="removeDrag($event)" ng-mouseleave="addDrag($event)" class="form-control input-sm" name="' + fieldName + '/>
      </div>
    </div>
  </div>
</div>


scope.removeDrag = function (event) {
  $(event.currentTarget).prop("draggable", false);
  $(element[0].parentElement).prop("draggable", false);
}

scope.addDrag = function (event) {
 $(event.currentTarget).prop("draggable", true);
 $(element[0].parentElement).prop("draggable", true);
}

基本上，只要我鼠标进入输入，它就会禁用输入和父元素的可拖动属性。这使我可以单击输入，突出显示文本，还可以使用“x”（ms-clear）。一旦鼠标离开输入，我们就可以再次拖动元素。

不是一个完美的解决方案，但这解决了我的用例。

【讨论】：

element[0] 在这个解决方案中来自哪里？