- ベストアンサー
IEで，テキストエリアの選択範囲を設定する方法
- javascriptでテキストエリアの選択範囲を設定したく、http://d.hatena.ne.jp/language_and_engineering/20090225/p1を参考に試験しましたが、正しく選択範囲が設定されません。どこが悪いのでしょうか？
- 正しく選択範囲が設定されるサンプルがあれば、ご教示いただければありがたいです。
- IEでテキストエリアの選択範囲を設定する方法について詳しく教えてください。
- kahata
- お礼率39% (66/168)
- JavaScript
- 回答数4
- ありがとう数12
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
というわけで、マルチブラウザー対応 <textarea id="my_input" cols=50 rows=10> あいうえおかきこけこ さしすせそたちつてと なににねのはひふへほ </textarea> <input type="button" onclick="f()" value="選択"> <script type="text/javascript"> function f(){ var elem = document.getElementById( "my_input" ); setSelection(elem,5,15); } function setSelection(elem,start,end){ elem.value=elem.value.replace(/\s/g,''); try{ elem.setSelectionRange(start,end); }catch(e){ var end_new = - ( elem.value.length - end ); var range = elem.createTextRange(); range.moveStart( "character", start ); range.moveEnd( "character", end_new ); range.select(); } } </script>
その他の回答 (3)
- yyr446
- ベストアンサー率65% (870/1330)
訂正 //IE以外 function select(start,end){ var elem = document.getElementById("my_input"); elem.value.replace(/\s/g,''); elem.setSelectionRange(start,end); }
- yyr446
- ベストアンサー率65% (870/1330)
IE以外なら、 <script type="text/javascript"> function select(start,end){ var elem = document.getElementById("my_input"); elem.setSelectionRange(start,end); } </script> <textarea id='my_input'> あいうえおかきこけこ さしすせそたちつてと なににねのはひふへほ </textarea> <button onclick='select(5,15);'>Select</button> でOK
- yyr446
- ベストアンサー率65% (870/1330)
＜textarea id="my_input" cols=50 rows=10＞ あいうえおかきこけこ さしすせそたちつてと なににねのはひふへほ ＜/textarea＞ の記述がまずい。（lengthが36です。改行文字も数えられてしまいます。） ＜textarea id="my_input" cols=50 rows=10＞あいうえおかきこけこさしすせそたちつてとなににねのはひふへほ＜/textarea＞ と書けば全体で30文字でlengthも30になります。
補足
レスありがありがとうございます。 おっしゃるとおり改行を全部取り去って1行にすれば参考例の＜input＞同じでうまくいきますが、通常＜textarea＞で一行にすることはまずありません。 選択範囲取得のほうは、以下のサイトで確認すると http://www.teria.com/~koseki/memo/xbselection/example.html 改行があっても、改行を2文字と数えてうまく選択範囲が取得されます。 改行を含むtextareaで正しく選択範囲を設定する方法をご教示いただきたく、よろしくお願いします。
お礼
いろいろ調べましたが、以下のツールで処理するのが手っ取り早いようです http://plugins.jquery.com/project/a-tools
補足
ご検討ありがとうございます。 ANo.1の自動改行削除バージョンですね。 しかしこの方法はtextareaの内容が書き換えられます。 当方の質問が説明不足であったかもしれません。 質問の趣旨は「(日本語)の文字位置」で選択したいのではなく、start,endをいわばポインタ的に指定して、textareaの内容を保持したまま、 「 かきくけこ さしすせそ」 を改行付きで選択したいということで、そのためには setSelection(elem,5,17); にすべきでした。 この目的は http://www.teria.com/~koseki/memo/xbselection/example.html のget selectionとペアにして、textareaに簡単な自動編集機能を付与することです。 ではまたよろしくお願いします。