ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScript を使用してテキストボックス内のテキスト選択を保存および取得する方法

JavaScript を使用してテキストボックス内のテキスト選択を保存および取得する方法

Linda Hamilton
Linda Hamiltonオリジナル
2024-10-24 10:41:02741ブラウズ

How to Preserve and Obtain Text Selection in Textboxes Using JavaScript?

JavaScript を使用したテキストボックスから選択されたテキストの取得

選択保持メカニズムの実装

クエリ:

他のコントロールを操作した後でも、テキストボックス内のテキストの選択を保持するにはどうすればよいですか?

解決策:

他の要素をクリックしてもテキストボックスの選択を保持するには、次のアプローチ:

  1. ドキュメントの onKeyDown イベントを利用して、キーが押されたときに選択されたテキストを読み取る関数を呼び出します。
  2. 選択範囲読み取り関数では、フォーカスを利用します。 () メソッドでテキストエリアにフォーカスを戻し、選択範囲がアクティブなままであることを確認します。
document.onkeydown = function (e) { ShowSelection(); }

テキストボックスから選択されたテキストを取得する

クエリ:

テキストボックス内で選択されているテキストをプログラムで取得するにはどうすればよいですか?

解決策:

テキストボックスから選択されたテキストを取得するには、次の手順に従います。手順:

  1. getElementById 関数を使用してテキストボックス要素を識別します。
  2. selectionStart プロパティとselectionEnd プロパティを使用して、選択したテキストの開始位置と終了位置を決定します。
  3. 部分文字列メソッドを使用して、選択したテキストを抽出します。
function ShowSelection()
{
  var textComponent = document.getElementById('Editor');
  var selectedText;

  if (textComponent.selectionStart !== undefined)
  {
    var startPos = textComponent.selectionStart;
    var endPos = textComponent.selectionEnd;
    selectedText = textComponent.value.substring(startPos, endPos);
  }
  else if (document.selection !== undefined)
  {
    textComponent.focus();
    var sel = document.selection.createRange();
    selectedText = sel.text;
  }

  alert("You selected: " + selectedText);
}

以上がJavaScript を使用してテキストボックス内のテキスト選択を保存および取得する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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