Javascript e、 preventDefault（）-将其应用于除一个div之外的所有div时出现问题

我已经在stack上阅读了很多与此问题相关的内容，但我似乎无法解决我的问题

基本上，我使用的是jQueryModal

我想要发生的是，当模态启动时，也就是：

$(".buttonSpacing").click(function() {
    $("#page").modal();
}

模态按预期打开。包含在该模式的div中的是contenteditable div。基本上，我希望防止默认设置contenteditable div之外的所有内容。当模式关闭时，我希望事件随后被解除绑定

大概是这样的：

$(".buttonSpacing").click(function() {
    $("#page").modal();

    $(':not(#myContentEditableDiv)').bind('mousedown',function(e)
    {
        e.stopPropagation(); // Tried with and without this line
        e.preventDefault();
    });
}

似乎不起作用。myContentEditableDiv将丢失默认功能以及其他所有功能

如果前面的问题已经回答了这个问题，我想我无法将它正确地应用于我的情况

原因是我希望光标始终保持在可编辑区域中，无论光标留在何处，即使在我让他们选择要动态添加到可编辑区域的内容时，或者如果他们意外单击可编辑区域之外的内容时也是如此

考虑到我的情况，我怎样才能做到这一点

谢谢你的帮助

编辑：

下面是一个js小提琴，显示了问题：

---

问题是鼠标按下事件正在从文本区域传播到父元素，从而阻止默认操作。要解决此问题，请添加以下内容：

$('#textArea').bind('mousedown', function(e) {
    e.stopPropagation();
})

更新的JSFIDLE:

---

注意，您可能需要处理其他元素上的mouseup事件，因为它们不会触发click事件，因为在mousedown事件上调用了preventDefault。

jsidle上的代码helpful@marzelin现在在这里放一个js小提琴的例子