IE（7-8）を使用してHTMLエディタでカーソルを設定するには

Question

実際には、は、HTMLエディタ（contenteditable iframeを使用します）内の特定のノードにカーソルを設定しようとしています。たとえば、いくつかの段落があり、カーソルを前の段落の先頭に移動したいとします。 不幸にも、Internet Explorerの範囲オブジェクトはsetStartBeforeとsetStartAfterをサポートしていません。 The ierange projectはオプションではありません。私が探している解決策は、そのままの状態でIEで動作する必要があります。

IEでカーソルを設定するにはどうすればよいですか？ Firefoxので

解決策は単純です：

// sets the cursor position (start defines, if cursor is needed at the start or end of the node) 
function setCursor(editor, node, start){ 

var tn = editor.getDoc().createTextNode("."); // gets the editors document 
    if (start){ 
    node.insertBefore(tn, node.firstChild); 
    } 
    else node.appendChild(tn); 

    rng = editor.selection.getRng(); // gets the browsers range object for the users selection 
    rng.selectNode(tn); 
    rng.setStartBefore(tn); 
    rng.setStartAfter(tn); 

    ed.selection.setRng(rng); 
    node.removeChild(tn); // removes the caret node - curser is placed now 
} 

Answer 1

あなたはこのために私のRangyプロジェクトを使用することができます。コードはその後、すべてのブラウザで同じようになります：

また

function setCursor(element, start) { 
    var doc = element.ownerDocument || element.document; 
    var win = doc.defaultView || doc.parentWindow; 

    rangy.init(); 
    var range = rangy.createRange(doc); 
    range.selectNodeContents(element); 
    range.collapse(start); 
    rangy.getSelection(win).setSingleRange(range); 
} 

、この特定のケースでは、ライブラリなしで、あまりにもトリッキーではありません。

function setCursor(element, start) { 
    var doc = element.ownerDocument || element.document; 
    if (typeof doc.createRange != "undefined") { 
     var range = doc.createRange(); 
     range.selectNodeContents(element); 
     range.collapse(start); 
     var win = doc.defaultView || doc.parentWindow; 
     var sel = win.getSelection(); 
     sel.removeAllRanges(); 
     sel.addRange(range); 
    } else if (typeof doc.body.createTextRange != "undefined") { 
     var textRange = doc.body.createTextRange(); 
     if (start) { 
      textRange.moveToElementText(element); 
      textRange.collapse(start); 
     } else { 
      var markerEl = doc.createElement("span"); 
      markerEl.innerHTML = "\u00A0"; 
      element.appendChild(markerEl); 
      textRange.moveToElementText(markerEl); 
      element.removeChild(markerEl); 
     } 
     textRange.select(); 
    } 
} 

Answer 2

Working with the Cursor Position （このソリューションはIE、FirefoxとOperaで私の作品）