jQuery 可拖动选项禁用布局答案

【问题标题】：jQuery draggable option disable layoutjQuery 可拖动选项禁用布局
【发布时间】：2014-02-27 16:43:50
【问题描述】：

我从网上得到这个代码：

<div id="draggable">
  <div id = "editable" contenteditable="true"> </div>
</div>

<script>
var draggableDiv = $('#draggable').draggable();

$('#editable', draggableDiv).mousedown(function(ev) {
     draggableDiv.draggable('disable');
}).mouseup(function(ev) {
     draggableDiv.draggable('enable');
});
</script>

代码：http://jsfiddle.net/cSMYG/1/

如何更改默认事件，当我单击并按住文本字段上的光标，然后在按住的同时将鼠标悬停在文本字段外，会使文本字段不灰色？我知道是什么原因造成的，但我无法解决。

【问题讨论】：

你的解释很糟糕。请尽量做到更清晰、更具体，不要在每两个单词后使用单词对“文本字段”。
@user2831723 使用“文本字段”来引用文本字段有什么问题？如果有什么不清楚的地方，我觉得提出问题以获得更多细节或就如何改进提出建议比说“你的解释非常糟糕。请更清楚和具体”更有帮助。话虽如此，问题可以使用一些改进。描述当前正在发生的事情、您希望发生的事情以及您尝试过的事情对于帮助他人回答您的问题大有帮助。

标签： javascript jquery html jquery-ui draggable

【解决方案1】：

您需要在祖先元素上附加mouseup 事件处理程序。例如：

$(document).mouseup(function(ev) {
     draggableDiv.draggable('enable');
});

jsFiddle

您可能还想跟踪它是否在变量中被禁用，然后在每次mouseup 事件启用它之前检查它：

var isDraggableEnabled = ...

【讨论】：

对象点击后是否可以不变灰？
@Larssen 它没有变灰，但实际上变得更加透明。我相信这是由 jQuery UI 设置的，所以你需要覆盖它应用的样式：.ui-state-disabled { opacity: 1; }