当我尝试完全隐藏控件选择(这就是它们的调用方式)时,我自己在这方面花了很多时间CKEditor http://ckeditor.com's widgets http://docs.ckeditor.com/#!/guide/widget_sdk_intro。不幸的是我没有好消息。
解决方案1
首先,有一个mscontrolselect http://msdn.microsoft.com/en-us/library/ie/ms536915%28v=vs.85%29.aspx事件。当我发现它时(事实上它的名字有一个ms
前缀)我很高兴,因为根据MS http://connect.microsoft.com/IE/feedback/details/791253/ie-11-enableobjectresizing-execcommand-support它应该是可以预防的。
但事实证明它完全不稳定。有时会被解雇,有时则不会。它因 IE 版本、DOM 结构、属性、您单击的元素、它是块元素等而异。通常的 MS 的废话。但你可以尝试:
function controlselectHandler(evt) {
evt.preventDefault();
}
document.body.addEventListener('mscontrolselect', controlselectHandler);
但是,这将完全阻止选择(如果有效的话)。因此,您将使这些元素根本无法选择。
解决方案2
然后还有第二个选项,更可靠 - 单击此类元素后将选择移动到其他位置。有几种方法可以实现这一点。在 CKEditor 中,我们正在修复选择mousedown
... and mouseup
因为(再次)有时这对于 IE 来说是不够的,它取决于许多条件。您还可以收听selectionchange
事件并修复那里的选择。
然而,我们再次讨论的是阻止选择此类元素。
解决方案3
因此,第三个选项不是阻止选择,而是阻止resizestart
事件。 CKEditor 将其与enableObjectResizing
命令:https://github.com/ckeditor/ckeditor-dev/blob/a81e759/plugins/wysiwygarea/plugin.js#L211-L218 https://github.com/ckeditor/ckeditor-dev/blob/a81e759/plugins/wysiwygarea/plugin.js#L211-L218。此解决方案将阻止调整大小,但当然不会隐藏那些丑陋的边框。
解决方案4
正如我提到的,我在 CKEditor 中解决了这个问题。我们设法使可编辑元素中包含不可编辑元素成为可能,但浏览器之间的行为完全可控且统一。完整的解决方案太复杂,无法在 StackOverflow 上解释,我们花了几个月的时间才实现它。我们将此功能称为小部件。看一些演示在这里 http://ckeditor.com/demo#widgets。正如您所看到的,当选择不可编辑元素时,没有控件选择。该选择仅在以下时间间隔内出现:mousedown
and mouseup
,但仅限于特定情况。除此之外,一切都像本机一样工作(尽管它完全是假的)。
阅读更多内容小部件简介 http://docs.ckeditor.com/#!/guide/dev_widgets并在小部件教程 http://docs.ckeditor.com/#!/guide/widget_sdk_intro.