Home/ Questions/Q 6952771
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-27T14:23:30+00:00

Let’s start with code: <html> <head> <title>Opera bug test</title> <script type=text/javascript> function callTest() {

  • 0

Let’s start with code:

<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>

THIS code works well: click on link->Ctrl+C->”Text TO Test!!!!” in clipboard. Good!

Now, in previous code lets do one tiny change, line:

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

replace with 3 lines:

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

Literally – just insert couple ‘new line’ in HTML code. And all broken! Click on link continue to select (visually) text, but Ctrl+C DON’T push it into clipboard. Besides, even visual selection is… strange, to be say. For example, in test 1: click on link->text selected->click on empty place on page->text DEselected. It’s normal behaviour. in test 2: click on link->text selected->click on empty place on page->text RETAIN it’s selection highlight!

What this? Horrible bug from Opera? 🙂

P.S. I did my experiments in Windows XP SP3, Opera 11.60 (build 1185).

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    it’s Opera issue with empty textNodes (or line breaks inside them)

    the fix is to check a node type of the children elements inside your div to see if they are elements

    e.g.:

        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);
    • 0