前提・実現したいこと
テキストエリアに結構長い文章が入っています。
テキストボックスに入れた文字列がテキストエリアの中の文章にあるかどうかを検索し、あれば文字列を選択した状態にした後、その文字列の場所をフォーカスしたいです。
テキストボックスに入れた文字列を検索し、文字列を選択するところまではできました。
検索した文字列が今表示されているテキストエリアの範囲内にある場合は、文字列が選択されている状態なのですぐにわかるのですが、文字列が文章の最後のほうにある場合、選択された文字列を見つけるには、スクロールバーでテキストエリア内の文章を送らないと見つけることができません。
そこで、検索した文字列が文章の最後のほうにある場合でも、自動的にテキストエリア内の文章がその文字列があるところにフォーカスするような動きに直したいのです。
どうぞよろしくお願いします。
※文字列を選択させなければ、検索した文字列が文章の最後のほうにあっても、自動的にテキストエリア内の文章が文字列があるところにフォーカスされます。
発生している問題・エラーメッセージ
該当のソースコード
ソースコード
function FirstSearch(){ //「KensakuMoji」にテキストボックスに入れた文字列の値をセット var KensakuMoji = document.getElementById("txtb").value; //alert("KensakuMojiは"+ KensakuMoji); //regに「g」フラグを設定し、正規表現の文字列検索をセットする reg = new RegExp(KensakuMoji, "g"); //「Txt_1」に、テキストエリアの文章をセット var Txt_1=document.getElementById("Txt_Bun").value; //検索文字がテキストエリアの文章の中にあるか正規表現で検索 var result = Txt_1.match(reg); if(result != null) { //alert("文字列が見つかりました"); //Searchで文書頭から文字列を検索し、見つかった文字の位置を取得 var Ichi_First = Txt_1.search(reg); //alert("Ichi_Firstは"+ Ichi_First); //検索した文字列を選択する document.getElementById("Txt_Bun").setSelectionRange(Ichi_First, Ichi_First + 1); //document.getElementById("Txt_Bun").setSelectionRange(Ichi_First, Ichi_First); //↑ここで「(Ichi_First, Ichi_First + 1)」を「(Ichi_First, Ichi_First)」にして、文字列を選択するようにしなければ、文章の最後のほうに検索文字列があっても、テキストエリア内の文章が自動的に検索文字列にフォーカスされます //カーソルがある位置のテキストエリアを表示するため //テキストエリアをフォーカスし直す document.getElementById("Txt_Bun").focus(); }else{ //検索したい文字が見つからない場合 alert("文字列が見つかりませんでした"); //テキストエリアをフォーカスし直す document.getElementById("txtb").focus(); document.getElementById("Txt_Bun").focus(); } }
HTML <!DOCTYPE html> <html lang="ja"> <head> <meta charset="Shift_JIS"> <title></title> <link rel="stylesheet" type="text/css" href="Check.css" media="all"> <script type="text/javascript" src="http://code.jquery.com/jquery-3.2.1.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script src="searchhi_slim.js"></script> <style> </style> </head> <body> 文字列:<input type="txt" id="txtb"><br> <input type="button" value="検索" onclick="FirstSearch()"> </DIV> <DIV style="margin-left:35%;"> <input type="file" id="loadFile" size="106"><br> <textarea id="Txt_Bun" rows="30" cols="81" style="font-size:1em;"></textarea> </DIV> <!-- スクリプト --> <script type="text/javascript" src="Kensaku111.js" charset="Shift_JIS"></script> </body> </html>
### 試したこと いろいろなサイトを検索してみましたが、解決しませんでした。 ### 補足情報(FW/ツールのバージョンなど) ここにより詳細な情報を記載してください。