window.getSelection在textarea中得到正确的选择 [英] window.getSelection get the right selection in textarea

问题描述

在firefox和chrome中window.getSelection是用来获取当前在文档中的选择，但是当前的选择是在一个textarea中，window.getSelection没有返回选择，而是textarea本身。
那么，如何在firefox和chrome中进行正确的选择呢？

解决方案

一个textarea？您可能会要求selectionStart和selectionEnd（在Internet Explorer中不存在，可与Firefox和Chrome一起使用）

 选择下面的一些文本然后点击按钮：< br /> 
< textarea id =myTextarearows =5cols =30> 
 Lorem ipsum dolor sit amet，
 consectetur adipiscing elit。 
< / textarea> 
< button onclick =alert（getTextSelection（））>提醒文本选择< /按钮> 
 
< script type =text / javascript> 
函数getTextSelection（）{
 var field = document.getElementById（myTextarea）; 
 var startPos = field.selectionStart; 
 var endPos = field.selectionEnd; 
 var field_value = field.value; 
 var selectedText = field_value.substring（startPos，endPos）; 
返回selectedText; 
} 
< / script> 
  

如果有多个textareas，并且您希望在select上获得输出：

 在textarea中选择一些文字：< br /> 
< textarea rows =5cols =30onselect =alert（getTextSelection（this））> 
 Lorem ipsum dolor sit amet，
 consectetur adipiscing elit。 
< / textarea> 
 
 
< textarea rows =5cols =30onselect =alert（getTextSelection（this））> 
命运似乎
不是没有讽刺意义
< / textarea> 
 
 
< script type =text / javascript> 
函数getTextSelection（field）{
 var startPos = field.selectionStart; 
 var endPos = field.selectionEnd; 
 var selectedText = field.value.substring（startPos，endPos）; 
返回selectedText; 
} 
< / script> 
  

或者您仍然可以通过按钮来实现，但使用全局变量：

 在textarea中选择一些文本，然后点击按钮：< br /> 
< textarea rows =5cols =30onselect =window.selectedTextarea = this> 
 Lorem ipsum dolor sit amet，
 consectetur adipiscing elit。 
< / textarea> 
 
 
< textarea rows =5cols =30onselect =window.selectedTextarea = this> 
命运似乎
不是没有讽刺意义
< / textarea> 
 
 
 
< button onclick =alert（getTextSelection（））>提醒文本选择< /按钮> 
 
 
 
< script type =text / javascript> 
 //警告：全局变量：脏！ 
 var selectedTextarea 
 
 function getTextSelection（）{
 var field = window.selectedTextarea; 
 var startPos = field.selectionStart; 
 var endPos = field.selectionEnd; 
 var selectedText = field.value.substring（startPos，endPos）; 
返回selectedText; 
} 
< / script> 
  

in firefox and chrome window.getSelection is used to get the current selection in document,but is the current selection is in a textarea,the window.getSelection didn't return the selection,but the textarea itself. So,how to the right selection in firefox and chrome?

解决方案

Do you need to get the selected text in a textarea? You may be asking for selectionStart and selectionEnd (does not exist in Internet Explorer, works with Firefox and Chrome)

 Select some text below and then click the button:<br/>
<textarea id="myTextarea" rows="5" cols="30">
Lorem ipsum dolor sit amet, 
consectetur adipiscing elit.
</textarea>
<button onclick="alert(getTextSelection())">alert text selection</button>

<script type="text/javascript">
    function getTextSelection(){
        var field = document.getElementById("myTextarea");
        var startPos = field.selectionStart;
        var endPos = field.selectionEnd;        
        var field_value = field.value;
        var selectedText = field_value.substring(startPos,endPos);
        return selectedText;
    }   
</script>

If there are multiple textareas and you wish to get the output on select:

Select some text in either textarea:<br/> 
<textarea rows="5" cols="30" onselect="alert(getTextSelection(this))"> 
Lorem ipsum dolor sit amet,  
consectetur adipiscing elit. 
</textarea> 


<textarea rows="5" cols="30" onselect="alert(getTextSelection(this))"> 
fate it seems
not without a sense of irony 
</textarea> 


<script type="text/javascript"> 
    function getTextSelection(field){        
        var startPos = field.selectionStart; 
        var endPos = field.selectionEnd;          
        var selectedText = field.value.substring(startPos,endPos); 
        return selectedText;
    }    
</script>

Or you can still do it with a button but by using a global variable:

Select some text in either textarea and click the button:<br/> 
<textarea rows="5" cols="30" onselect="window.selectedTextarea=this"> 
Lorem ipsum dolor sit amet,  
consectetur adipiscing elit. 
</textarea> 


<textarea rows="5" cols="30" onselect="window.selectedTextarea=this"> 
fate it seems
not without a sense of irony 
</textarea> 



<button onclick="alert(getTextSelection())">alert text selection</button>



<script type="text/javascript"> 
// warning: global variable: dirty!!!
var selectedTextarea

    function getTextSelection(){        
        var field = window.selectedTextarea;
        var startPos = field.selectionStart; 
        var endPos = field.selectionEnd;          
        var selectedText = field.value.substring(startPos,endPos); 
        return selectedText;
    }    
</script> 

这篇关于window.getSelection在textarea中得到正确的选择的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！