jQueryでフォームの値をすべて取得する方法
jQueryでフォームの値を全て取得する
html
<form id="myform">
<input type="text" name="mytext" value="sample text." />
<select name="myselect">
<option value="1">test1</option>
<option value="2">test2</option>
<option value="3">test3</option>
</select>
</form>
html
<form id="myform">
<input type="text" name="mytext" value="sample text." />
<select name="myselect">
<option value="1">test1</option>
<option value="2">test2</option>
<option value="3">test3</option>
</select>
</form>
javascript
var $form = $('#myform');
var query = $form.serialize();
var param = $form.serializeArray();
console.log(query);// => "mytext=sample+text&myselect=1"
console.log(param);// => [{name:"mytext",value:"sample text"},...]
フォームの値をまとめて全部取ってこれます。
.serialize()で通常のGET送信のようにパラメーター化されます。
.serializeArray()でそれを配列に分解したものが得られます。
サーバーに送信するにも便利な形になります。
変数名に$（ドルマーク）が付いているのはphpも使う私の誤りではありません。
JavaScriptは$の付く変数名も有効だそうです。
特に$に機能的な意味があるのではなく、jQueryで生成されたオブジェクト変数に$を付けるのはJavaScriptのお作法だそうです。
関連 2013-12-02 12:11:54