3 of 119 menu

val メソッド

メソッド val は要素の現在の値を 取得および変更することができます。

構文

セット内の最初の要素の現在の値を取得するには 以下のようにします:

$(セレクタ).val();

メソッド val は主に、 inputselecttextarea などの フォーム要素の値を取得するために使用されます。 空のコレクションで呼び出された場合、undefined を返します。 属性 multiple が設定された select を扱う場合、 このメソッドは選択された各 option の値の配列を返します。 一つも選択されていない場合は空の配列が返されます。 セット内の各要素に値を設定するには以下のようにします。 パラメータとして文字列、配列、または数値を渡すことができます:

$(セレクタ).val(値);

セット内の各要素に関数を適用します。 関数の最初のパラメータはセット内の現在のインデックス、 二番目のパラメータはその現在の値です:

$(セレクタ).val(属性名, function(セット内のインデックス, 現在の値));

次の例では、入力フィールドに入力された値を取得し、 その下の段落に表示してみましょう:

<input type="text" value="text"> <p></p> p { color: green; margin: 8px; } $('input').keyup(function() { let value = $(this).val(); $('p').text(value); }).keyup();

次に、val メソッドを使って、 クリックしたボタンのテキストを下にある入力フィールドに 設定してみましょう:

<div> <button>one</button> <button>two</button> <button>three</button> <button>four</button> </div> <input type="text" value="click buttons"> button { margin: 4px; cursor: pointer; } input { margin: 4px; color: green; } $('button').click(function() { let text = $(this).text(); $('input').val(text); });

関連項目

  • 要素の属性を操作できるメソッド attr
  • 要素のプロパティを操作できるメソッド prop
日本語
AfrikaansAzərbaycanБългарскиবাংলাБеларускаяČeštinaDanskDeutschΕλληνικάEnglishEspañolEestiSuomiFrançaisहिन्दीMagyarՀայերենIndonesiaItalianoქართულიҚазақ한국어КыргызчаLietuviųLatviešuМакедонскиMelayuမြန်မာNederlandsNorskPolskiPortuguêsRomânăРусскийසිංහලSlovenčinaSlovenščinaShqipСрпскиSrpskiSvenskaKiswahiliТоҷикӣไทยTürkmenTürkçeЎзбекOʻzbekTiếng Việt
当サイトでは、サイトの動作、分析、パーソナライゼーションのためにクッキーを使用しています。 データ処理はプライバシーポリシーに従って行われます。
すべて受け入れる 設定 拒否