ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScript を使用してテキスト入力の最後にカーソルを配置するにはどうすればよいですか?

JavaScript を使用してテキスト入力の最後にカーソルを配置するにはどうすればよいですか?

Mary-Kate Olsen
Mary-Kate Olsenオリジナル
2024-12-06 17:33:12582ブラウズ

How Can I Place the Cursor at the End of Text Input Using JavaScript?

JavaScript を使用した入力テキストの末尾へのカーソルの挿入

Web 開発の領域では、JavaScript はテキストの末尾にカーソルを配置するための堅牢なソリューションを提供します入力要素内。このトピックを詳しく掘り下げるために、簡潔なテクニックから始めて、さまざまなアプローチを検討します。

this.selectionStart = this.selectionEnd = this.value.length;

このスニペットは、カーソルを入力値の末尾に効果的に配置します。ただし、特定のブラウザでは、以下に示すように、より包括的な解決策を必要とする問題が発生します。

setTimeout(function() { that.selectionStart = that.selectionEnd = 10000; }, 0);

このバリエーションでは、setTimeout 関数を利用してカーソル位置の設定を延期し、それによって互換性の問題を最小限に抑えます。

jQuery 愛好家のために、リスナーを使用するアプローチを次に示します。

$('#el').focus(function() {
  var that = this;
  setTimeout(function() { that.selectionStart = that.selectionEnd = 10000; }, 0);
});

このコード スニペットjQuery を利用してフォーカス イベント リスナーを確立します。フォーカスされると、前の例と同じカーソル位置決め手法が展開されます。

以上がJavaScript を使用してテキスト入力の最後にカーソルを配置するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。