Some usage examples of jscreateRange and createTextRange _ javascript skills

For more information about createTextRange and createRange, see the enhanced version of script home. 1. return text and htmlText of createTextRange

<Script language = "javascript"> <! -- Function test () {var rng = document. body. createTextRange (); alert (rng. text)} function test1 () {var rng = document. body. createTextRange (); alert(rng.html Text)} // --> script <input type = "button" onclick = "test () "value =" text "> <input type =" button "onclick =" test1 () "value =" htmlText ">
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]

2. Obtain the selected text in the specified text box: only the first text box is returned.

<Input id = "inp1" type = "text" value = "1234567890"> <input id = "inp2" type = "text" value = "9876543210"> <input type = ""button" onclick = "test () "value =" OK "> <script language =" javascript "> <! -- Function test () {var o = document. getElementById ("inp1") var r = document. selection. createRange (); if (o. createTextRange (). inRange (r) alert (r. text);} // --> script
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]

3. reverse search of page text

Abababababababa <input value = "reverse query a" onclick = myfindtext ("a") type = "button"> <script language = 'javascript '> <! -- Var rng = document. body. createTextRange (); function myfindtext (text) {rng. collapse (false); if (rng. findText (text,-1, 1) {rng. select (); rng. collapse (true) ;}else {alert ("end") ;}// --> script
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]

4. Focus the control and put the cursor at the end

<Script language = "javascript"> <! -- Function setFocus () {var obj = event. srcElement; var txt = obj. createTextRange (); txt. moveStart ('character ', obj. value. length); txt. collapse (true); txt. select () ;}// --> script <input type = "text" value = "http://jb51.net" onfocus = "setFocus ()">
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]

5. Obtain the cursor position in the text box.

<Script language = "javascript"> <! -- Function getPos (obj) {obj. focus (); var s = document. selection. createRange (); s. setEndPoint ("StartToStart", obj. createTextRange () alert (s. text. length );} // --> script <input type = "text" id = "txt1" value = "1234567890"> <input type = "button" value = "Get cursor position" onclick = getPos (txt1)>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]

6. Control the cursor position in the input box

<Script language = "javascript"> <! -- Function setPos (num) {text1.focus (); var e = document. getElementById ("text1"); var r = e. createTextRange (); r. moveStart ('character ', num); r. collapse (true); r. select () ;}// --> script <input type = "text" id = "text1" value = "1234567890"> <select onchange = "setPos (this. selectedIndex) "> <option value =" 0 "> 0 </option> <option value =" 1 "> 1 </option> <option value =" 2 "> 2 </option> <option value = "3"> 3 </option> <option value = "4"> 4 </option> <option value = "5"> 5 </option> <option value = "6"> 6 </option> <option value = "7"> 7 </option> </select>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]

7. Select a text section in the text box

<Script language = javascript> <! -- Function sel (obj, num) {var rng = obj. createTextRange () var sel = rng. duplicate (); sel. moveStart ("character", num); sel. setEndPoint ("EndToStart", rng); sel. select () ;}// --> script <input type = "text" id = "text1" value = "1234567890"> <select onchange = "sel (text1, this. value) "> <option value =" 0 "> 0 </option> <option value =" 1 "> 1 </option> <option value =" 2 "> 2 </option> <option value = "3"> 3 </option> <option value = "4"> 4 </option> <option value = "5"> 5 </option> <option value = "6"> 6 </option> <option value = "7"> 7 </option> </select>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]

8. control the movement of the cursor in the text box

<Input type = "button" value = "<" onclick = go (-1)> <input id = "demo" value = "here is the text"> <input type = "button" value = ">" onclick = go (1)> <script language = "javascript"> <! -- Function go (n) {demo. focus (); with (document. selection. createRange () {moveStart ("character", n); collapse (); select ();}} // --> script/[html] 9. Take the cursor position [html] <body> <p id = box> click textarea </p> <script type = "text /javascript "> <! -- Function doit () {var rng = event. srcElement. createTextRange (); rng. moveToPoint (event. x, event. y); rng. moveEnd ("character", event. srcElement. value. length) box. innerText = "cursor position:" + (event. srcElement. value. length-rng. text. length)} // --> script <textarea onclick = doit () rows = "6" cols = "33"> sdfsdfsdfsdfsdfsdfsdf
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]

10. Use the mouse to select some fonts. The selected fonts will be automatically pasted in textarea.

<Html> script function aa () {newT = document. selection. createRange () clipboardData. setData ("Text", newT. text) document. all. pp. value = clipboardData. getData ("Text")} script to test this. Hello, I am skanso <textarea name = pp> </textarea> </ptml>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]