「jQuery」selectでフォーカス時に文字を全選択状態にするサンプル

2013年6月8日2022年3月14日

環境
jQuery 3.6.0
Google Chrome 99.0.4844.51

書式
$(セレクタ名).focus().click(function(){
$(this).select();
focus()を利用してフォーカス時に文字を全選択状態にします

使用例

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
  //テキストボックスにフォーカスが当たった時に実行する
  $("input[type='text']").focus()
    .click(function(){
      $(this).select();
      return false;
    });
});
</script>
</head>
<body>
  <input type="text" value="山田 太郎"　name="username">
</body>
</html>

実行結果
テキストボックスにフォーカスを当てると、「山田太郎」全選択状態となります。

jQuery

Posted by arkgame

関連記事: