textarea的window.getSelection()在Firefox中不起作用?

Posted

技术标签:

【中文标题】textarea的window.getSelection()在Firefox中不起作用?【英文标题】:window.getSelection() of textarea not working in firefox? 【发布时间】:2013-12-23 13:05:34 【问题描述】:

我正在尝试在 html 页面上获取选择文本。

我使用下面的代码,而 window.getSelection() 的 textarea 接缝在 Firefox 中不起作用, 但在 Google Chrome 中运行良好。

我使用的是 firefox 24 和 chrome 27。

这是一个示例: http://jsfiddle.net/AVLCY/

HTML:

<div>Text in div</div>
<textarea>Hello textarea</textarea>
<div id='debug'></div>

JS:

$(document).on('mouseup','body',function()
   $("#debug").html("You select '" + getSelectionText() + "'");
);

function getSelectionText() 
    if (window.getSelection) 
        try 
            // return "" in firefox
            return window.getSelection().toString();
         catch (e) 
            console.log('Cant get selection text')
        
     
    // For IE
    if (document.selection && document.selection.type != "Control") 
        return document.selection.createRange().text;
    

【问题讨论】:

参考:***.com/questions/717224/… 这是由于Firefox bug filed in 2001(是的,14 年前)。 【参考方案1】:

由于this Firefox bug,getSelection 似乎不适用于在表单字段中选择的文本。

如this answer 中所述,解决方法是改用selectionStartselectionEnd

这是一个正确工作的修改示例:

http://jsfiddle.net/AVLCY/1/

【讨论】:

这个问题还有其他解决方案吗? 我将“textarea”更改为“:focus”,所以如果有多个 textarea 或输入字段,它可以工作:jsfiddle.net/AVLCY/653

以上是关于textarea的window.getSelection()在Firefox中不起作用?的主要内容,如果未能解决你的问题,请参考以下文章

给textarea添加行号,textarea使用代码风格的一些思考

textarea头部不顶行问题和textarea禁止拉伸

JavaFX:在进入 TextArea 时将插入符号/光标放在 TextArea 的末尾

更改 textarea 中的 textarea 光标颜色

为啥 textarea 不是 input[type="textarea"]?

如何使用另一个 textarea 编辑 textarea 值?