IE用WYSIWYGエディタ

Question

デザインモードONのIframeを使用した新しいWYSIWYGエディタを作成したいと思います。ユーザーがテキストを選択してイメージボタンをクリックするとイメージがバックグラウンドになるはずですテキストの画像を切り替える必要があります

Answer 1

InsertHTMLコマンドはIEでは機能しません。しかし、IEのTextRangeオブジェクトには、代わりに使用できる便利な​​メソッドがあります。

ライブデモ：http://jsfiddle.net/RmXgy/1/

コード：

function getSelectedText() { 
    var selectedText = "", sel; 
    if (window.getSelection) { 
     selectedText = "" + window.getSelection(); 
    } else if ((sel = document.selection) && sel.type == "Text") { 
     selectedText = sel.createRange().text; 
    } 
    return selectedText; 
} 

var sel, html = '<span style="background-image: url(foo.png)">' 
     + getSelectedText() + "</span>"; 

if ((sel = document.selection) && sel.type != "Control") { 
    sel.createRange().pasteHTML(html); 
} else { 
    document.execCommand("InsertHTML", false, html); 
}