jQueryでformを操る【nameの値を取得する】

form周り、これまでは要素を特定してループさせやすいようにidやclassを付与して、JavaScriptが結構な行数を使って面倒だったけど、jQueryを使えば「さくッ」と取得できて便利。今回は、nameの値を取得する、にフォーカスします。

inputのvalue値

サンプル

<input type="" name="sample" value="" />

type="text"

$('[name=sample]').val();

type="radio"

$('[name=sample]:checked').val();

チェックがない場合は「undefined」が返ってきます（Firefox 23で確認）。

type="checkbox"

$('[name=sample]:checked').map(function(){
return $(this).val();
}).get();

チェックボックスは複数チェックさせることもあるため、そのケアも必要。
この例だと値がセットされた配列を取得できる。
チェックがない場合は「undefined」が返ってきます（Firefox 23で確認）。

selectのvalue値

サンプル

<select name="sample_select">
<option value="">ラベルテキスト</option>
</select>

$('[name=sample_select]').val();

複数選択可能なmultipleのときも取得方法は同様。単数のときはテキストを取得するのに対し、multipleのときは配列で取得する。