javascript - 防止单击其他元素时丢失突出显示

Question

我正在开发一个博客，我想要一个部分来添加帖子。我想象它与我现在用来写这篇文章的 StackExchange 编辑器非常相似。

我已经成功地使用文本区域来获取当前插入符位置、插入位置等信息。

我现在遇到的问题是当用户单击另一个元素(即粗体工具)时，不会丢失文本区域中突出显示的文本。

默认情况下(至少在 Chrome 中)，当您突出显示文本区域中的文本，然后单击页面上的其他位置时，文本区域将失去焦点，突出显示的文本也会随之失去。

Answer 1

当文本区域失去焦点时，默认情况下它将丢失任何先前的选择，因此在 onblur 事件中，您可以使用以下函数保存当前选择:

    function getSelectedText() {
        var txtarea = document.getElementById(textBoxScript);
        var start = txtarea.selectionStart;
        var finish = txtarea.selectionEnd;
        var sel = txtarea.value.substring(start, finish);
        return sel;
    }

要将其设置回焦点事件，您可以使用以下函数:

    function selectText(startPos, endPos, tarea) {
        // Chrome / Firefox
        if (typeof (tarea.selectionStart) != "undefined") {
            tarea.focus();
            tarea.selectionStart = startPos;
            tarea.selectionEnd = endPos;
            return true;
        }
        // IE
       if (document.selection && document.selection.createRange) {
            tarea.focus();
            tarea.select();
            var range = document.selection.createRange();
            range.collapse(true);
            range.moveEnd("character", endPos);
            range.moveStart("character", startPos);
            range.select();
            return true;
       }
    }