Firefoxでリッチテキスト編集について質問です。


リッチテキスト編集モードにしたiframeに適当な文字列を入力します。
入力したテキストの一部を選択し、そのテキストの前の文字列を取得したいと思います。

(例:「あいうえお」と入力し「うえ」を選択してボタンを押すと「あい」が表示される。

以下のようなソースを書いたのですが上手くいきません。どこをどのようにしたらいいのでしょうか?
(なんとなくですが、selectionStartが取得できていないように思います)

--以下ソース--
function docTest(){
var doc = document.getElementById("edit").contentDocument; //editはiframeのid名
doc.designMode = "on";

var selStart = doc.selectionStart;
var text = doc.body.innerHTML.toString();
str = text.substring(0,selStart);

document.getElementById("preview").innerHTML = str; //出力用
}

回答の条件
  • 1人2回まで
  • 登録:2008/07/28 18:53:18
  • 終了:2008/07/29 16:22:22

ベストアンサー

id:sheile No.1

Sheile回答回数45ベストアンサー獲得回数162008/07/29 10:42:01

ポイント100pt

仕様書上の記述は見つけられなかったのですが、selectionStartはテキストボックスでないと動作しないような気がします。

ウィンドウ上の選択情報は以下の形で取得できるようです。

function docTest(){
	var doc = document.getElementById("edit"); //editはiframeのid名
	doc.contentDocument.designMode = "on";

	var selection = doc.contentWindow.getSelection();
	var str = selection.anchorNode.nodeValue.substring(0, selection.anchorOffset);

	document.getElementById("preview").innerHTML = str; //出力用
}

なお、Ctrlを押しながらの複数選択に対応する場合には以下の形の方が使いやすいかもしれません。

	var selection = doc.contentWindow.getSelection().getRangeAt(0);
	var str = selection.startContainer.nodeValue.substring(0, selection.startOffset);

お好みでどうぞ。

※Firefox3.0にて動作確認

id:kt26

「選択情報」ではなく、「選択情報の前後の文字列」が取得したいと思い、質問しました。


ただ、非常に勉強になります。もう少し調べたいと思います。ありがとうございました。

2008/07/29 11:26:46

その他の回答(1件)

id:sheile No.1

Sheile回答回数45ベストアンサー獲得回数162008/07/29 10:42:01ここでベストアンサー

ポイント100pt

仕様書上の記述は見つけられなかったのですが、selectionStartはテキストボックスでないと動作しないような気がします。

ウィンドウ上の選択情報は以下の形で取得できるようです。

function docTest(){
	var doc = document.getElementById("edit"); //editはiframeのid名
	doc.contentDocument.designMode = "on";

	var selection = doc.contentWindow.getSelection();
	var str = selection.anchorNode.nodeValue.substring(0, selection.anchorOffset);

	document.getElementById("preview").innerHTML = str; //出力用
}

なお、Ctrlを押しながらの複数選択に対応する場合には以下の形の方が使いやすいかもしれません。

	var selection = doc.contentWindow.getSelection().getRangeAt(0);
	var str = selection.startContainer.nodeValue.substring(0, selection.startOffset);

お好みでどうぞ。

※Firefox3.0にて動作確認

id:kt26

「選択情報」ではなく、「選択情報の前後の文字列」が取得したいと思い、質問しました。


ただ、非常に勉強になります。もう少し調べたいと思います。ありがとうございました。

2008/07/29 11:26:46
id:sheile No.2

Sheile回答回数45ベストアンサー獲得回数162008/07/29 13:52:37

ポイント35pt

あれ。選択情報を元に「選択情報の前を表示する」プログラムを載せたつもりなんですが・・・

(例:「あいうえお」と入力し「うえ」を選択してボタンを押すと「あい」が表示される。

は実現できていると思いますよ?

id:kt26

sheileさんが書いてくれた下のコード部分を置き換えたら実現出来ていました。再三のご指摘ありがとうございます。

2008/07/29 16:22:06
  • id:sheile
    コメントを修正して再登録しようとして回答してしまいました・・・
    ポイントがもったいないでしょうし、2個目の回答は開かない方が良いかと思います。

    先の回答で載せたプログラムは、「選択情報」を元として「選択情報の前の文字列」を取得する物です。
    > (例:「あいうえお」と入力し「うえ」を選択してボタンを押すと「あい」が表示される)
    に関しては問題なく実現できていると思いますよー

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません