파이어 폭스에서 텍스트 영역

Question

의 오른쪽 선택을받을 window.getSelection와 크롬 window.getSelection이 문서의 현재 선택을 얻기 위해 사용되지만, 현재의 선택이 텍스트 영역에서이다의 window.getSelection는 선택을 반환하지 않았습니다 그러나 텍스트 영역 자체. 그럼 파이어 폭스와 크롬의 올바른 선택 방법은 무엇입니까?

Answer 1

텍스트 영역 및 텍스트 입력에는 차분 선택 API가 있습니다. 텍스트 상자/입력의 value 속성 내에서 문자 오프셋 인 selectionStart 및 selectionEnd 속성이 있습니다. 이러한 속성은 HTML5에서 표준화되었으며 모든 주요 브라우저의 최신 버전에서 구현됩니다. IE < 9에는 다른 API가 다시 있습니다.

Answer 2

텍스트 영역에서 선택한 텍스트를 가져와야합니까? 당신이 지정한 selectionStart와 selectionEnd에 요청 할 수있다

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> 

여러 텍스트 영역이있는 경우 (Internet Explorer에서 존재하지 않는, 파이어 폭스와 크롬에서 작동) 그리고 당신은 선택의 출력을 얻을하고자 :

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> 

는 또는 당신은 여전히 ​​버튼을하지만, 전역 변수 사용하여 작업을 수행 할 수 있습니다 : 당신이 집중되는 텍스트 영역 알고

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>