2011-02-13 6 views
3

Firefox 3은 JS로 여러 텍스트 영역을 선택할 수 있습니다. Chrome과 IE에서 이렇게하는 방법이 있습니까?Chrome 및/또는 IE에서 JS로 여러 텍스트 영역을 선택하는 방법이 있습니까?

Chrome과 IE9의 웹 페이지에 여러 개의 텍스트 영역을 선택하는 방법을 실제로 찾으려고했습니다.


정보를 정기적으로 : http://help.dottoro.com/ljxsqnoi.php


예에서 : http://jsfiddle.net/t3sWz/


코드 FireFox3.5 + 만 ... (하지만이 질문) :

<html> 

<head> 
    <meta charset="UTF-8"> 
    <style> 
     #trigger { background: yellow } 
    </style> 
</head> 

<body> 
    <p id="test"> 
     This is some text you can highlight by dragging or clicking below. 
    </p> 
    <span id="trigger"> 
     Click here to select "This" and "some" 
    </span> 
    <a> - Firefox only :-(</a> 
    <br> 
    <br> 
    <br> 
    <br> 
    <br> 
    <input type="button" value="Get selection" onmousedown="getSelText()"> 
    <form name=aform> 
     <textarea name="selectedtext" rows="5" cols="20"> 
     </textarea> 
    </form> 
    <script> 
     var testCase = function() { 
      var userSelection; 

      if (window.getSelection) { 
       userSelection = window.getSelection(); 
      } // No support for IE 
      var textNode = document.getElementById('test').firstChild; 
      var theRange = document.createRange(); 

      // select 0th–4th character 
      theRange.setStart(textNode, 0); 
      theRange.setEnd(textNode, 4); 

      // set user selection  
      userSelection.addRange(theRange); 

      var textNode = document.getElementById('test').firstChild; 
      var theRange = document.createRange(); 

      // select 8th–12th character 
      theRange.setStart(textNode, 8); 
      theRange.setEnd(textNode, 12); 

      // set user selection  
      userSelection.addRange(theRange); 
     }; 

     window.onload = function() { 
      var el = document.getElementById('trigger'); 
      el.onclick = testCase; 
     }; 

     function getSelText() { 
      var txt = ''; 
      if (window.getSelection) { 
       txt = window.getSelection(); 
      } else if (document.getSelection) { 
       txt = document.getSelection(); 
      } else if (document.selection) { 
       txt = document.selection.createRange().text; 
      } else 
      return; 
      document.aform.selectedtext.value = txt; 
     } 
    </script> 
</body> 

+0

왜이 작업을 수행 하시겠습니까? 나는 유스 케이스에 관심이있다. –

답변

3

아니요. 주요 브라우저 중 Firefox에서만 사용자 선택 범위 내에서 여러 범위를 지원합니다. 다른 브라우저 (WebKit, Opera, IE9)는 복수 범위를 지원하는 Selection API를 가지고 있지만 현재 지원하지 않습니다. WebKit은 apparently not planning to add support any time soon입니다. 오페라와 IE에 관해서는, 나는 모른다.