rng = obj.createTextRange() rng = document.selection.createRange()上は、body、 button、 text、 textarea に適用されます。 下はマウスで選択された範囲から TextRange オブジェクトを得ます。
rng.text
例えば、下のテキストボックスに文字を入力してボタンを押すと、
その文字が表示されます。
var rng = form.text1.createTextRange();
alert(rng.text);
rng.select()
例えば、下のテキストボックスに文字を入力してボタンを押すと、
その文字が選択されます。
var rng = form.text1.createTextRange();
rng.select();
rng.boundingLeft rng.boundingTop rng.boundingWidth rng.boundingHeight例えば下のようなボタンの文字の、ドキュメントの上からの座標を得ます。
var rng = obj.createTextRange(); //objはボタン alert(rng.boundingTop);
rng.execCommand(sCommand
[, bUserInterface [, vValue]])
コマンドの実行が成功すれば true、
失敗すれば false が帰ります。最初は delete コマンドの例です。
var rng = form.text1.createTextRange();
rng.execCommand("delete");
テキストボックスに何か入力してボタンを押してください。
delete コマンドが実行されて、テキストが消去されます。
var rng = document.selection.createRange();
if(form.radio1[0].checked)
rng.execCommand("Bold");
else if(form.radio1[1].checked)
rng.execCommand("ForeColor", false, "red");
else
rng.execCommand("Paste");
マウスで適当に文字を選択して、項目を選択して、ボタンを押してください。
1番目を選択していれば選択部分が太字に、2番目なら文字が赤くなります。
3番目は何かコピーされていれば、選択部分がそれに置き換えられます。コマンドはその TextRange オブジェクトによって 実行できるかどうか変わります。 実行できるかどうかは queryCommandEnabled で確かめられます。
rng.queryCommandEnabled(sCommand)
実行できるなら true が、
できないなら false が返ります。
var rng = form.text1.createTextRange();
alert(rng.queryCommandEnabled("Bold"));
テキストボックスに何か入力して、
それに対して Bold コマンドが実行できるかどうか調べると、
false が返ってきて実行できないことが分かります。
rng.moveStart(unit [, count]) rng.moveEnd(unit [, count])moveStart は範囲の先頭を moveEnd は範囲の最後を動かします。
var rng = document.selection.createRange(); rng.moveStart("character", -1); rng.moveEnd("character", 1); rng.select();文字をマウスで選択しボタンを押すと、選択範囲が前後1文字ずつ広がります。
unit を textedit を使うと、 範囲が最後まで広がるので、現在の選択位置を知ることができます。
var rng = document.selection.createRange();
rng.moveEnd("textedit");
alert(form.text1.value.length - rng.text.length);
テキストボックスに何か入力して、適当に文字を選択してください。
何文字目から選択されているかを表示します。
先頭から選択されていれば0です。
もう1つ例を挙げます。
var findstr = form.elements[0].value;
var len = findstr.length;
var oRange = document.body.createTextRange();
if(oRange.text.indexOf(findstr) == -1) {
alert("検索終了");
return;
}
//検索文字列が先頭になるまでtextRangeオブジェクトの先頭を進める
while(oRange.text.indexOf(findstr) > 0)
oRange.moveStart("character", 1);
//textRangeオブジェクトが検索文字列と同じ長さになるまで末尾を後退する
while(oRange.text.length > len)
oRange.moveEnd("character", -1);
oRange.select();
検索文字列をテキストボックスに入力ボタンを押すと、
このページ内を検索します。検索されたらそのテキストが選択されます。