人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

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; //出力用
}

●質問者: kt26
●カテゴリ:ウェブ制作
✍キーワード:BODY DOC firefox ON STR
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● Sheile
●100ポイント ベストアンサー

仕様書上の記述は見つけられなかったのですが、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にて動作確認

◎質問者からの返答

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


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


2 ● Sheile
●35ポイント

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

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

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

◎質問者からの返答

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

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ