ユーザーは、JavaScriptオブジェクトのテキスト部分を処理するために使用されるオブジェクトであるTextrangeオブジェクトに関連付けることを要求しているためです。
Textrangeは、HTML要素で漢字を表現するために使用されるオブジェクトです。このオブジェクトはあまり使用していませんが、IE4.0で提供されています。しかし、Textrangeが提供する呼び出し方法は比較的あいまいなので、それで何ができますか？
Textrangeの従来の使用は、変更、削除、新しい追加など、Webページにマウスを使用してユーザーが選択したテキストコンテンツを操作することです。しかし、その古典的な目的は、Webページでテキスト（これは比較的簡単です）を見つけて、入力ボックスカーソルの位置を取得することです。後者は、以下など、より多くの有用な用途を生成できます。入力MaskTextBoxの制限、そのコア技術ポイントは、入力ボックスのカーソル位置を取得し、正規表現を使用して入力コンテンツを判断することです。また、後で導入する「入力ボックスマトリックスで自然にナビゲートするために矢印キーを使用する」もあります。コアテクニカルポイントは、入力ボックスのカーソル位置を取得することでもあります。
入力ボックスのカーソル位置を取得するためのコード全体は実際には非常に短いですが、これらのオブジェクトとメソッドはあまり一般的に使用されていません。
JSコード
<span style = "font-size：medium;"> <スクリプト言語= "javascript"> function getCursorpsn（txb）{var slct = document.selection; var rng = slct.createrange（）; txb.select（）; rng.setEndpoint（ "starttostart"、slct.createrange（））; var psn = rng.text.length; rng.collapse（false）; rng.select（）; psnを返します。 } </script> </span>ここでは、getCursOrpsN（）メソッドを使用した後に入力ボックス操作にもたらす副作用について説明します。
入力ボックス用
HTMLコード
<span style = "font-size：medium;"> <入力タイプ= "text" onkeydown = "getCursorpsn（this）"> </span>
Shift+左および右矢印キーを使用してテキストを選択することはできなくなります。
HTMLコード
<span style = "font-size：medium;"> <textarea onkeydown = "getCursorpsn（this）"> </textarea> </span>
、テキストを選択するために、Shift+ Up、down、左方向、および右の方向キーを使用することはできなくなりました。コードがテキストの現在のカーソルの起動点を取得した後、rng.collapse（false）を呼び出すため。テキストバスケット内のテキストの編集ポイントを変更します。
1.ユーザー要件を満たすためのコードスニペット、上、下、左、右のキーを使用してテキストボックスのジャンプを実現し、テキストボックスのコンテンツを選択してユーザーの変更を容易にします。コードは次のとおりです。
JSコード
<span style = "font-size：medium;"> var range = $ currenttextfield.createTextrange（）; // $ currentTextfieldはjQueryオブジェクト範囲です。 range.select（）; </span>
以下は、私がかなり気分がいいテキストランジュに関するインポートされた記事です：
HTMLコード
<！doctype html public " - // w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns = "http://www.w3.org/1999/xhtml"> <head> <title> new Document> new Document> new Document </title> <meta http-equiv = "content-type" content = "text/html; charset = utf-8"/> <スタイル> {font-zize：12px; } #show {background-color：＃ccff99; } </style> </head> <body> <textarea id = "content" cols = "30" rows = "10">川の魚は奇妙に死に、下流の住民は奇妙な病気に苦しみ、海岸沿いの植物は絶えず変異します。それらは残留農薬ですか？または生化学的攻撃？ CCTV -10「科学探査」今夜、今後の特別プログラム：「川沿いの神秘的な足洗いマン」</textarea> <button id = "btn"> <div id = "show"> </div> <スクリプト> protototy.trim = function（）{reaplace（/s+fent（^/s+fent） ""）; } /*方法1つのff* / function getSelectText（）{try {// ie：document.selection.createrange（）w3c：window.getselection（）var selecttext =（document.selection && document.selection.createrange）？ document.selection.createrange（）。テキスト：window.getSelection（）。toString（）; if（selectText！= null && selectText.trim（）！= ""）{return selectText; }} catch（err）{}} /* method 2* / function getSelectText2（id）{var t = document.getElementById（id）; if（window.getSelection）{if（t.selectionstart！= undefined && t.selectionEnd！= undefined）{return t.value.substring（T.SelectionStart、T.SelectionEnd）; } else {return ""; }} else {return document.selection.createrange（）。text; }} document.getElementById（ 'btn'）。onclick = function（）{document.getElementById（ 'show'）。 } </script> </body> </html>