点击其他区域不让编辑器失去焦点

最新推荐文章于 2025-12-04 22:56:41 发布

转载最新推荐文章于 2025-12-04 22:56:41 发布 · 359 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：https://www.cnblogs.com/rainbowLover/p/14156274.html

文章标签：

#前端 #javascript #开发语言

文章讲述了在编辑器中选中文本后，如何通过阻止事件冒泡来确保选中状态不丢失。实现方法是通过监听`mousedown`事件并自定义`stopProp`函数来防止事件继续向上层元素传播，以此来维持选中文本的焦点。

选中编辑器内一段文本，然后点击顶部操作按钮，不想让选中的文字失去选中状态。

实现方式为：阻止编辑器区域外的事件进行事件冒泡。

但是不能直接在onclick上写，因为这个时候事件都冒泡完都到传递的阶段了，你在这个地方防止事件冒泡，晚了。

document.getElementById('id').addEventListener("mousedown",this.stopProp);

//阻止
    stopProp=(e)=>{
        if ( e && e.preventDefault ){
            e.preventDefault();
        }else{
            window.event.returnValue = false;
        }
        return false;
    }