Выделите текст внутри DIV в Opera с помощью JavaScript - PullRequest
1 голос
/ 16 декабря 2011

Давайте начнем с кода:

<html> 
<head> 
<title>Opera bug test</title> 

<script type="text/javascript"> 
function callTest() 
{ 
  var oElem=document.getElementById("testDIV"); 

  if (window.getSelection) 
  { 
    var oCurSelection=window.getSelection(); 
    var curRange=document.createRange(); 
    curRange.selectNodeContents(oElem); 
    oCurSelection.removeAllRanges(); 
    oCurSelection.addRange(curRange); 
  } 
} 
</script> 
</head> 

<body> 
<a onclick="callTest();" style="text-decoration: underline; cursor: pointer">Select</a> 
<div id="testDIV"><span>Text TO Test!!!!</span></div>
</body> 
</html> 

ЭТОТ код работает хорошо: нажмите на ссылку-> Ctrl + C -> «Text TO Test !!!!»в буфер обмена.Хорошо!

Теперь в предыдущем коде давайте сделаем одно крошечное изменение, строку:

<div id="testDIV"><span>Text TO Test!!!!</span></div>

заменим на 3 строки:

<div id="testDIV">
<span>Text TO Test!!!!</span>
</div>

Буквально - просто вставьте паруНовая строка »в HTML-коде.И все сломано!Нажмите на ссылку продолжить, чтобы выбрать (визуально) текст, но Ctrl + C НЕ помещайте его в буфер обмена.Кроме того, даже визуальный отбор ... странно, скажем так.Например, в тесте 1: нажмите на ссылку-> выделенный текст-> щелкните пустое место на странице-> выделенный текст.Это нормальное поведение.в тесте 2: нажмите на ссылку-> выделенный текст-> щелкните пустое место на странице-> текст ОСТАВАЙТЕ выделение выделения!

Что это?Ужасный баг из Оперы?:)

PS Я проводил эксперименты в Windows XP SP3, Opera 11.60 (сборка 1185).

1 Ответ

1 голос
/ 16 декабря 2011

это проблема Opera с пустыми текстовыми узлами (или разрывами строк внутри них)

исправление заключается в проверке типа узла дочерних элементов внутри вашего div, чтобы увидеть, являются ли они элементами

например:

    var curRange=document.createRange(); 
    var children = oElem.childNodes,
    ind, child;

    for(ind in children) {
        child = children[ind];
        console.log(child.nodeType);
        if (child.nodeType == Node.ELEMENT_NODE) {
            console.log(child);
            curRange.selectNodeContents(child); 
            oCurSelection.addRange(curRange); 
        }
    }
   // oCurSelection.removeAllRanges(); 
    //oCurSelection.addRange(curRange); 
...