jQuery - input タグの value の設定・取得

公開日：2018-12-10
更新日：2019-05-14

1. 概要

<input>タグの value の設定と取得を行います。

<input>タグ value の設定

$(セレクタ).val( 文字列 );

<input>タグ value の取得

var value = $(セレクタ).val();

2. サンプル

<input>タグの value を動的に書き換えます。

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>jQuery</title><style>body{color:#fff; background-color:#000;}</style></head>
<body>
  <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>

  <!-- 画面 -->
  <input id="msg" value="Hello" />
  
  <!-- Script -->
  <script>
    $(function() {
      //取得
      console.log( $("#msg").val() );
      
      //設定
      $("#msg").val("こんにちは");
    });
  </script>

</body></html>

Hello

実行結果：画面

＜前の記事

jQuery - テキストの設定・取得

次の記事＞

jQuery - 要素内の先頭、または最後への子要素の追加

jQuery - input タグの value の設定・取得

1. 概要

2. サンプル

新着一覧

アーカイブ

以前のカテゴリー一覧