HTMLで長いテ​​キスト入力の最後までスクロールするにはどうすればよいですか?

長いテキスト入力の最後までスクロールする: 詳細な解決策

Web アプリケーションの世界では、長い URL を収容するテキスト入力フィールドに遭遇することがよくあります。これにより URL に十分なスペースが提供されますが、多くの場合、URL の先頭が表示され、より有益な末尾が非表示のままになります。

課題:

ナビゲーションユーザーは最後まで手動でスクロールする必要があるため、テキスト フィールドにこのような長い URL を入力するのは面倒な作業になります。この不便さを軽減するために、開発者は URL の右端まで直接「スクロール」できるソリューションを模索しました。これにより、手動でスクロールする必要がなくなり、URL の末尾にすぐにアクセスできるようになります。

答え:

ありがたいことに、HTMLInputElement.setSelectionRange() メソッドは、次の解決策を提供します。この挑戦。入力フィールドに focus() を明示的に設定し、その後、selectionRange() を入力値の長さに設定すると、カーソルは URL の末尾に自動的に配置されます。

実装:

<code class="javascript">var foo = document.getElementById("foo");
foo.value = "http://stackoverflow.com/questions/1962168/scroll-to-the-very-right-of-a-long-text-input";
foo.focus();
foo.setSelectionRange(foo.value.length, foo.value.length);</code>

注:

この解決策は、IE6 ～ 8 と Opera を除くすべてのブラウザーに適用できることに注意することが重要です。これらの特定のブラウザでは、入力がフォーカスを失うとカーソルがフィールドの先頭に戻ることがあります。

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