0

jqueryでフォームの値を扱う

jqueryでフォームの値を取得する時、毎回調べてしまうのでまとめとく。
ID指定してattrとかでもいけるんだろうけど、checkboxの時に統一できないんで。

HTML
<form name="form">
タイトル
<input type="text" name="title" id="title">
<br />
コメント
<input type="textarea" name="com" id="com"></textarea>
<br />
血液
<input type="radio" name="blood" id="blood_A" value="A" />A型
<input type="radio" name="blood" id="blood_B" value="B" />B型
<br />
趣味
<input type="checkbox" name="hobby" id="hobby_A" value="サッカー" />サッカー
<input type="checkbox" name="hobby" id="hobby_B" value="野球" />野球
<br />
都道府県
<select name="pref">
<option value="東京">東京</option>
<option value="大阪">大阪</option>
</select>
<input type="button" value=" クリック " onclick="show()" />
</form>

javascript
<script type="text/javascript"><!--
function show() {
$("#result").html('');
//name
$("#result").append($('input[@name=title]').val());
// textarea
$("#result").append($('input[@name=com]').val());
// radio
$("#result").append($('input[@name=blood]:checked').val());
// checkbox
$('input[@name=hobby]:checked').each(function(){
$("#result").append($(this).val());
});
// select
$("#result").append($('select[@name=pref]').val());
}
// --></script>

大阪のWEB屋です。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です