[解決済み] JavaScriptのsetSelectionRange()メソッドとカーソル位置について
2022-02-28 02:41:34
質問
私は、ユニコード文字(以下、txtToIns変数で表される)をテキスト本文に動的に挿入するためのJavaScriptの次の部分を持っています。
elmt.value = elmt.value.substring(0, elmt.selectionStart) + txtToIns + " " + elmt.value.substring(elmt.selectionStart, elmt.selectionEnd) + elmt.value.substring(elmt.selectionEnd, elmt.value.length) + " ";
elmt.focus();
elmt.value = elmt.value.trim();
上記では、カーソルは常にテキストの末尾にあります。txtToInsの直後に配置する方法はないでしょうか?また、txtToIns.focus()はうまくいきません。
どのように解決するのですか?
テキストエリアの値の中にあるスペース文字、特に最後の文字は2行後にまた切り捨てられるので、以下のコードではスペースを無視しています。また、以前に選択されていたテキストをどうしたいのかもわからないので、新しいテキストで上書きしたいのだろうと推測します。
をサポートしていないIE < 9では動作しないことに留意してください。
selectionStart
,
selectionEnd
また
setSelectionRange()
.
デモ http://jsfiddle.net/timdown/wPfVn/
コード
var val = elmt.value;
var start = elmt.selectionStart, end = elmt.selectionEnd;
elmt.value = val.slice(0, start) + txtToIns + val.slice(end);
elmt.focus();
var caretPos = start + txtToIns.length;
elmt.setSelectionRange(caretPos, caretPos);
関連
-
[解決済み】Facebook Graph API のクエリで with=location を使用すると "Uncaught (in promise) undefined" というエラーが発生する。
-
[解決済み] [Solved] Uncaught TypeError: nullのプロパティ 'appendChild' を読み取ることができない。
-
[解決済み】Javascript、[オブジェクトHTMLInputElement]を表示中。]
-
[解決済み] JavaScriptで "use strict "は何をするのか、その根拠は?
-
[解決済み] JavaScriptで文字列が部分文字列を含むかどうかを確認する方法は?
-
[解決済み] あるJavaScriptファイルを他のJavaScriptファイルにインクルードするにはどうすればよいですか?
-
[解決済み] JavaScriptでタイムスタンプを取得する方法は?
-
[解決済み】JavaScriptの比較では、どちらの等号演算子(== vs ===)を使うべきですか?
-
[解決済み】JavaScriptで文字列の出現箇所をすべて置換する方法
-
[解決済み】オブジェクトからプロパティを削除する(JavaScript)
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】SecurityError: オリジンを持つフレームがクロスオリジンフレームにアクセスするのをブロックした
-
[解決済み】jquery $.ajaxオブジェクトのresponseJSONプロパティを取得する方法 [重複]。
-
[解決済み】別のjsファイル内でJavaScriptの関数を呼び出す
-
[解決済み】エラー:リクエストのエンティティが大きすぎる
-
[解決済み】XMLパースエラー:ルート要素が見つからない コンソールの場所 FF
-
[解決済み】DOMException: サポートされているソースが見つからなかったため、読み込みに失敗しました。
-
[解決済み】WebSocket接続に失敗しました。WebSocket のハンドシェイク中にエラーが発生しました。予期しない応答コードです。400
-
[解決済み】TypeError:res.jsonは関数ではありません。
-
[解決済み】ETIMEDOUTエラーの対処方法は?
-
[解決済み】Javascript、[オブジェクトHTMLInputElement]を表示中。]