0

HTML/Javascriptを使用してシンプルなリッチテキストエディタを設計しています。iframeを使用しています。IE6（およびおそらく新しいバージョン）ではうまく機能していますが、FireFoxでは壊れています。iframeを編集したり使用したりすることはできません。

HTML<body>

<input type="button" id="bold" class="Button" value="B" onClick="fontEdit('bold');">
<input type="button" id="italic" class="Button" value="I" onClick="fontEdit('italic');">
<input type="button" id="underline" class="Button" value="U" onClick="fontEdit('underline');">
<hr>
<iframe id="TextEditor" class="TextEditor"></iframe>

Javascript（IE用）

TextEditor.document.designMode="on";
TextEditor.document.open();
TextEditor.document.write('<head><style type="text/css">body{ font-family:arial; font-size:13px; }</style> </head>');
TextEditor.document.close();
TextEditor.focus();

上記のスクリプトは、IEでiframeを編集可能にします。FFではそうしません。だから私はFFバージョンのためにいくつかのことを変更しました-

Javascript（FF用）

id("TextEditor").contentWindow.designMode="on";
id("TextEditor").contentWindow.open(); //this line is responsible for pop-ups
id("TextEditor").contentWindow.write('<head><style type="text/css">body{ font-family:arial; font-size:13px; }</style> </head>'); //this line throws error: id("TextEditor").contentWindow.write is not a function at the FF debug console.
id("TextEditor").contentWindow.close();
id("TextEditor").focus();

コードのこのセクションにより、FFは空白のページをターゲットとしてポップアップアラートをトリガーします。まだ壊れています。次に続くのはid()、およびfontEdit()-のようなものの一般的な関数です。

function fontEdit(x,y){
  TextEditor.document.execCommand(x,"",y);
  TextEditor.focus();
}

function id(id){
  return document.getElementById(id);
}

function tag(tag){
  return document.getElementsByTagName(tag);
}

FFはiframeをこのように処理しないと確信しています。では、ポップアップを表示せずに、iframeをリッチテキストエディタとして使用するにはどうすればよいですか。私はまだjQueryが苦手なので、jQueryを避けるように最善を尽くしてください。これが、カスタム関数がのようid()に機能し、tag()存在する理由です。

また、ダウンロードして使用できる無料のテキストエディタが他にもあることを認識しているので、そのような解決策を提案したり、車輪の再発明をしなければならない理由を尋ねたりしないでください。私がどこで間違っているのかを知っていて、実際に問題を解決するのを手伝ってくれる場合にのみ答えてください。

4

1 に答える 1

2

FFは、関数を呼び出しているため、空白のページをターゲットとしてポップアップアラートをトリガーします。window.open代わりに、を呼び出す必要がありますdocument.open。

window.open：新しいブラウザウィンドウを開きます。

document.open：出力ストリームを開いて、任意のdocument.write()またはdocument.writeln()メソッドからの出力を収集します。すべての書き込みが実行されると、このdocument.close()メソッドにより、出力ストリームに書き込まれたすべての出力が表示されます。 注：ドキュメントがターゲットにすでに存在する場合、そのドキュメントはクリアされます。

open（）メソッドを参照してください

これはあなたのために働くはずです：

id("TextEditor").contentWindow.document.designMode="on";
id("TextEditor").contentWindow.document.open(); //this line is responsible for pop-ups
id("TextEditor").contentWindow.document.write('<head><style type="text/css">body{ font-family:arial; font-size:13px; }</style> </head>'); //this line throws error: id("TextEditor").contentWindow.write is not a function at the FF debug console.
id("TextEditor").contentWindow.document.close();
于 2012-08-10T08:27:31.677 に答える