javascript中createTextRange用法

javascript中createTextRange用法

返回createTextRange的text和htmlText

<scriptlanguage="javascript">
functiontest()
{
varrng=document.body.createTextRange();
alert(rng.text)
}
functiontest1()
{
varrng=document.body.createTextRange();
alert(rng.htmlText)
}
</script>
<inputtype="button"onclick="test()"value="text">
<inputtype="button"onclick="test1()"value="htmlText">

获取指定文本框中的选中的文字：只响应第一个文本框

<inputid="inp1"type="text"value="1234567890">
<inputid="inp2"type="text"value="9876543210">
<inputtype="button"onclick="test()"value="确定">
<scriptlanguage="javascript">
functiontest()
{
varo=document.getElementById("inp1")
varr=document.selection.createRange();
if(o.createTextRange().inRange(r))
alert(r.text);
}
</script>

页面文本倒序查找

abababababababa
<inputvalue="倒序查找a"onclick=myfindtext("a")type="button">
<scriptlanguage='javascript'>
varrng=document.body.createTextRange();
functionmyfindtext(text)
{
rng.collapse(false);
if(rng.findText(text,-1,1))
{
rng.select();
rng.collapse(true);
}else
{alert("end");}
}
</script>

聚焦控件后把光标放到最后

<scriptlanguage="javascript">
functionsetFocus()
{
varobj=event.srcElement;
vartxt=obj.createTextRange();
txt.moveStart('character',obj.value.length);
txt.collapse(true);
txt.select();
}
</script>
<inputtype="text"value="http://toto369.net"onfocus="setFocus()">

得到文本框内光标位置

<scriptlanguage="javascript">
functiongetPos(obj){
obj.focus();
vars=document.selection.createRange();
s.setEndPoint("StartToStart",obj.createTextRange())
alert(s.text.length);
}
</script>
<inputtype="text"id="txt1"value="1234567890">
<inputtype="button"value="得到光标位置"onclick=getPos(txt1)>

控制input框内光标位置

<scriptlanguage="javascript">
functionsetPos(num)
{
text1.focus();
vare=document.getElementById("text1");
varr=e.createTextRange();
r.moveStart('character',num);
r.collapse(true);
r.select();
}
</script>
<inputtype="text"id="text1"value="1234567890">
<selectonchange="setPos(this.selectedIndex)">
<optionvalue="0">0</option>
<optionvalue="1">1</option>
<optionvalue="2">2</option>
<optionvalue="3">3</option>
<optionvalue="4">4</option>
<optionvalue="5">5</option>
<optionvalue="6">6</option>
<optionvalue="7">7</option>
</select>

选中文本框中的一段文字

<scriptlanguage=javascript>
functionsel(obj,num)
{
varrng=obj.createTextRange()
varsel=rng.duplicate();
sel.moveStart("character",num);
sel.setEndPoint("EndToStart",rng);
sel.select();
}
</script>
<inputtype="text"id="text1"value="1234567890">
<selectonchange="sel(text1,this.value)">
<optionvalue="0">0</option>
<optionvalue="1">1</option>
<optionvalue="2">2</option>
<optionvalue="3">3</option>
<optionvalue="4">4</option>
<optionvalue="5">5</option>
<optionvalue="6">6</option>
<optionvalue="7">7</option>
</select>

控制文本框内光标的移动

<inputtype="button"value="<"onclick=go(-1)>
<inputid="demo"value="这里是文字">
<inputtype="button"value=">"onclick=go(1)>
<scriptlanguage="javascript">
functiongo(n){
demo.focus();
with(document.selection.createRange())
{
moveStart("character",n);
collapse();
select();
}
}
</script>