拖动任何devexpress组件时如何防止其他元素突出显示？答案

【问题标题】：How to prevent other elements from highlighting when dragging any devexpress component?拖动任何devexpress组件时如何防止其他元素突出显示？
【发布时间】：2012-07-10 10:58:13
【问题描述】：

刚刚将我的 devexpress 版本更新到 12.1，现在所有可拖动元素都会突出显示 Chrome 上的背景元素（20.0.1132.47 m）。

例如，当我拖动拆分器时，所有页面都在闪烁，当我拖动 ASPxPivotGrid 或 ASPxGridView 字段时，字段有时会突出显示，附近的元素会突出显示，然后我拖过它们。在 ASPxGridview 中，当我重新调整列的大小并且将鼠标向上或向下移动一点时，几乎所有标题突出显示。当我在 ASPxPivotGrid 自定义表单中拖动字段时，也有不需要的突出显示..

顺便说一句，在 IE9、FF11、Opera 11.6 中运行良好。

这是 devexpress 错误吗？如何修复它，以便拖动不会突出显示背景元素？也许某种全局 jquery 函数会有所帮助？

【问题讨论】：

“突出显示”是指背景元素被选中吗？如果是这样，您可以尝试$(document).on("selectstart", false) 和.off 以防止在拖动过程中进行选择。（不过，我没有使用 devexpress 的经验。）
@pimvdb 是的，我的意思是他们被选中了。是的，$(document).on("selectstart", false) 和.off() 确实工作得很好，现在我只需要找到我应该打电话给他们的方式。附言为什么你写的是评论而不是答案？

标签： javascript jquery asp.net google-chrome devexpress

【解决方案1】：

您可以使用以下方法防止在整个文档中进行选择：

$(document).on("selectstart", false);

您可以通过删除该事件处理程序再次启用选择：

$(document).off("selectstart", false);

您可以在 mousedown 期间对元素禁用选择，并在 mouseup 期间再次启用它。用户触发mouseup 的位置无关紧要，因此将其附加到document：http://jsfiddle.net/Wdj6w/。

$("div").on("mousedown", function() {
  $(document).on("selectstart", false);
});

$(document).on("mouseup", function() {
  $(document).off("selectstart", false);
});

【讨论】：

谢谢，我最终将这个函数调用添加到 EndCallback 上的所有网格：function fixchrome() { if ($.browser.safari) { $(".dxpgHeader_DevEx,.dxsplVSeparator_DevEx,.dxgvHeader_DevEx").on("mousedown", function () { $(document).on("selectstart", false); }); }; }
@Bomberlt：你确定吗？这将一次又一次地绑定处理程序，并且不会删除它。
哦，是的，我也忘了添加 .off() :)

【解决方案2】：

您还可以通过 CSS 的 user-select 属性阻止选择。像这样：

 <div style="-webkit-user-select: none; -ms-user-select: none; -moz-user-select: none;">
   <p>I cannot be selected</p>
 </div>

见this css-tricks article

【讨论】：