Bonjour,

Je suis en train de tester une fonction permettant de créer une sélection avant, sur ou après un élément dans une div contenteditable.
Avec IE11, FF, Safari et Chrome, tout baigne.
Le problème est quand je mets IE11 en mode compatible IE8.
Curieusement, la fonction selectNodeContents(), qui est supposée être appliquée sur un node contenant du texte, plante sur un node de type 3 (text) et fonctionne sur le type 1 (element).

Est-ce que qqun aurait une explication, et si possible une autre solution ?

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
<!DOCTYPE  HTML>
<html>
<body>
<div  id="editable"  contenteditable="true">text1  text1  text1<br>text2  text2  text2<br>text3  text3  text3</div>
<TABLE  WIDTH="400"  BORDER="1"  CELLSPACING="0"  CELLPADDING="2">
    <TR  VALIGN="top">
      <TD>
      <INPUT  TYPE="radio"  NAME="element"  VALUE="0"  onclick="setElement(0)"  CHECKED>Node  0<BR>
      <INPUT  TYPE="radio"  NAME="element"  VALUE="1"  onclick="setElement(1)">Node  1<BR>
      <INPUT  TYPE="radio"  NAME="element"  VALUE="2"  onclick="setElement(2)">Node  2<BR>
      <INPUT  TYPE="radio"  NAME="element"  VALUE="3"  onclick="setElement(3)">Node  3<BR>
      <INPUT  TYPE="radio"  NAME="element"  VALUE="4"  onclick="setElement(4)">Node  4<BR>
      <INPUT  TYPE="radio"  NAME="element"  VALUE="-1"  onclick="setElement(-1)">Whole  editable</TD>
      <TD>
      <INPUT  TYPE="radio"  NAME="position"  VALUE="-1"  onclick="setSelection(-1)">Before<BR>
      <INPUT  TYPE="radio"  NAME="position"  VALUE="0"  onclick="setSelection(0)"  CHECKED>Whole  Zone<BR>
      <INPUT  TYPE="radio"  NAME="position"  VALUE="1"  onclick="setSelection(1)">After<BR>
      </TD>
    </TR>
    <TR><TD  ID="report"  COLSPAN="2">&nbsp;</TD></TR>
</TABLE>
</body>
<SCRIPT  ID="debugScript"  LANGUAGE="JavaScript"  SRC="/commun/debug/debug.js"></SCRIPT>
<script>
var  element  =  document.getElementById("editable")
var  el  =  element.childNodes[0];
var  node  =  0;
var  position  =  0;
function  setElement  (n)
    {
    node  =  n;
    el  =  (node  >=0  ?  element.childNodes[node]  :  element);
    setSelection(position)
    }
function  setSelection(pos)
    {
    var  content;
    if  (el.outerHTML)  content  =  el.outerHTML;
    else  if  (el.nodeValue)  content  =  el.nodeValue;
    document.getElementById  ('report').innerText  =  ("node  "  +  node  +  ",  type  =  "  +  el.nodeType  +  ",  content  =  "  +  content)
    position  =  pos;
    if(window.getSelection)  //  IE  >=  11
        {
        var  sel  =  window.getSelection();
        var  range  =  document.createRange();
        range.selectNodeContents(el);
        if(position  ==  -1)  
            {
            range.collapse(true);
            }
        else  if  (position  ==  1)  
            {
            range.collapse(false);
            }
        sel.removeAllRanges();
        sel.addRange(range);
        }
    else    //  IE  <  11
        {
        element.focus()
        var  range  =  document.body.createTextRange();
        try
            {
            range.moveToElementText(el);
            }
        catch  (e)	{alert("error  :  "  +  e.message)}
        if(position  ==  -1)  
            {
            range.collapse(true);
            }
        else  if  (position  ==  1)  
            {
            range.collapse(false);
            }
        range.select()
        }
    element.focus()
    }
setSelection(0);
</SCRIPT>
</HTML>