是否有使用JavaScript取消选择所有文本的功能？

97

javascript中是否有只取消选择所有选定文本的功能？我认为它必须是一个简单的全局函数，诸如此类document.body.deselectAll();。

javascript selection

— 死亡面条
source

163

试试这个：

function clearSelection()
{
 if (window.getSelection) {window.getSelection().removeAllRanges();}
 else if (document.selection) {document.selection.empty();}
}

这将清除任何主要浏览器中常规HTML内容中的选择。它不会清除文本输入或<textarea>Firefox中的选择。

— 安库尔
source

25

我可以确认它window.getSelection().removeAllRanges();可以在所有当前的浏览器中使用。现场演示： jsfiddle.net/hWMJT/1

— 森那维达斯

您必须单击<input id ='but'type ='button'value ='click'/ onclick ='clearSelection（）'>之类的按钮

— Ankur

1

@Šime-并非如此。这是“有效的”，因为当按钮获得焦点时，选择会丢失。证明 -代码已注释，选择仍被清除。

— 暗影巫师为您耳边

@Shadow这是正确的演示：jsfiddle.net/9spL8/3该removeAllRanges()方法在所有当前浏览器中都适用于段落或类似的非格式字段元素中的文本。对于表单域（如textarea），此方法在IE9和FF5中不起作用。

— 森那维达斯

1

编辑，使用window.getSelection().removeAllRanges(); 第一因为它是符合标准的，专有的代码应该总是被执行最后。无论是2004年还是符合4004标准的代码最终都将最终成为我们使用的代码，因此请毫无例外地首先对其进行检测！

— 约翰，

26

这是一个将清除所有选择的版本，包括文本输入和文本区域内：

演示：http：//jsfiddle.net/SLQpM/23/

function clearSelection() {
    var sel;
    if ( (sel = document.selection) && sel.empty ) {
        sel.empty();
    } else {
        if (window.getSelection) {
            window.getSelection().removeAllRanges();
        }
        var activeEl = document.activeElement;
        if (activeEl) {
            var tagName = activeEl.nodeName.toLowerCase();
            if ( tagName == "textarea" ||
                    (tagName == "input" && activeEl.type == "text") ) {
                // Collapse the selection to the end
                activeEl.selectionStart = activeEl.selectionEnd;
            }
        }
    }
}

— 蒂姆·唐
source

如果您选择从第一行开始的地方，包括更大的文本字段不起作用

— Vyachaslav Gerchicov

1

@VyachaslavGerchicov：这可能是因为这是一个快速制作的简单示例，如果您在主要事件之外结束选择，<div>则该mouseup事件不会触发。相反，将mouseup处理程序放在文档上就可以了：jsfiddle.net/SLQpM/23

— Tim Down

在较旧的浏览器中，当拖动元素时不支持用户选择的CSS，这是一个很好的解决方法。在鼠标移动回调中调用clearSelection（）。

— Geordie

6

对于Internet Explorer，可以使用document.selection对象的empty方法：

document.selection.empty（）;

有关跨浏览器的解决方案，请参见以下答案：

在Firefox中清除选择

— 卢克·吉文（Luke Girvin）
source

如果您的网站是公开的（不是您控制浏览器的Intranet），则不是个好主意，也就不是跨浏览器。

— 暗影巫师为您耳边

1

@Shadow向导-真实的，这个问题可能是恰当的，跨浏览器的解决方案：stackoverflow.com/questions/6186844/...

— 卢克·格文

@Luke很好，太糟糕了，因为OP照原样提供了其他网站，（可能）不同浏览器之间的网站不一致。

— 暗影巫师为您耳边

我认为浏览器兼容性是我们应该提供的显而易见的东西-许多开发人员甚至都不知道存在这种差异，因此，知道的人应该告诉他们。除此之外，我从未说过您的问题是错的，只是失踪了。

— 暗影巫师为您耳边

@Luke 仅在IE中document.selection.clear()起作用。参见此处：jsfiddle.net/9spL8/4另外，此方法将删除选定的文本，而不仅仅是取消选中它。要仅取消选择文本，请改用。document.selection.empty()

— –ŠimeVidas，2011年

0

对于textarea至少包含10个字符的元素，下面将进行少量选择，然后半秒后取消选择：

var t = document.getElementById('textarea_element');
t.focus();
t.selectionStart = 4;
t.selectionEnd = 8;

setTimeout(function()
{
 t.selectionStart = 4;
 t.selectionEnd = 4;
},1500);

— 约翰
source

0

这对我来说非常容易...

document.getSelection().collapseToEnd()

要么

document.getSelection().removeAllRanges()

积分：https : //riptutorial.com/javascript/example/9410/deselect-everything-that-is-selected

— 丹·奥尔特加
source