jQuery関数 serializeArray( )

手持ちのjQuery関連書にはどこにも記載されていなかったのでメモです。

serialize()

form内の要素を文字列データにシリアライズする関数

serializeArray( )

FormやElementをJSON形式のデータ構造でシリアライズする関数

まず、シリアライズとはなんぞや、というあたりから。

シリアライズ

ソフトウェア内部で扱っているデータを丸ごと、ファイルで保存したりネットワークで送受信することができるように変換すること。

シリアライズとは【serialize】（シリアライゼーション） – 意味/解説/説明/定義 ： IT用語辞典より

次に、試しに以下のフォームを用意してみました。

<form action="" id="JSON" method="POST">
	<dl>
		<dt>名前</dt>
		<dd><input type="text" name="name" value="ドリねこ" /></dd>
		<dt>分類</dt>
		<dd><input type="text" name="bunrui" value="猫" /></dd>
		<dt>好きな食べ物</dt>
		<dd><input type="text" name="favorite" value="海苔" /></dd>
	</dl>
</form>

で、jQueryが使える環境にて以下のスクリプトを実行。

<script type="text/javascript">
	$(function(){
		var data = $('#JSON').serializeArray();
	});
</script>

FirefoxのFirebugのコンソールで以下を入力。

>>> console.log($("#JSON").serializeArray());

すると、以下の内容が返ってきました。（※見やすいように整形しています。）
ちゃんと、JSON形式のデータになっていました！

[
	Object {
		name="name",
		value="ドリねこ"
	},
	Object {
		name="bunrui",
		value="猫"
	},
	Object {
		name="favorite",
		value="海苔"
	}
]