JQuery 中checkbox 取值问题.
JQuery中checkbox一直是一个缠绕已久的问题.现在贴出一段代码.很方便使用.
先上效果图:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Insert title here</title></head><body><form action="" ><div ><tr><td>省级地区</td><td>市级地区</td><td>县级地区</td></tr><tr><td rowspan="11"><input type="checkbox" id="Areacheckbox" name="areaCB" value="河北省" />河北省</td><td rowspan="4"><input type="checkbox" id="Areacheckbox" name="areaCB" value="石家庄" />石家庄</td><td><input type="checkbox" id="Areacheckbox" name="areaCB" value="无极" />无极</td></tr><tr><td><input type="checkbox" id="Areacheckbox" name="areaCB" value="正定" />正定</td></tr><tr><td><input type="checkbox" id="Areacheckbox" name="areaCB" value="新乐" />新乐</td></tr><tr><td><input type="checkbox" id="Areacheckbox" name="areaCB" value="藁城" />藁城</td></tr><tr><td><input type="checkbox" id="Areacheckbox" name="areaCB" value="唐山" />唐山</td><td></td></tr><tr><td><input type="checkbox" id="Areacheckbox" name="areaCB" value="张家口" />张家口</td><td></td></tr><tr><td><input type="checkbox" id="Areacheckbox" name="areaCB" value="沧州" />沧州</td><td></td></tr><tr><td rowspan="2"><input type="checkbox" id="Areacheckbox" name="areaCB" value="保定" />保定</td><td><input type="checkbox" id="Areacheckbox" name="areaCB" value="曲阳" />曲阳</td></tr><tr><td><input type="checkbox" id="Areacheckbox" name="areaCB" value="定州" />定州</td></tr><tr><td rowspan="1"><input type="checkbox" id="Areacheckbox" name="areaCB" value="廊坊" />廊坊</td><td><input type="checkbox" id="Areacheckbox" name="areaCB" value="霸州" />霸州</td></tr><tr><td rowspan="1"><input type="checkbox" id="Areacheckbox" name="areaCB" value="邢台" />邢台</td><td><input type="checkbox" id="Areacheckbox" name="areaCB" value="沙河" />沙河</td></tr><tr><tr><td rowspan="0"><input type="checkbox" id="Areacheckbox" name="areaCB" value="省外地区" />省外地区</td><td></td><td></td></tr><tr><tr></table></div><input type="button" value="选择" name="btn" /><input id="tags" style="width:500px;" type="text"/><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js">引入jquery</script><script type="text/javascript"> var checkBox = $('div.item input[type=checkbox]'), tagsBox = $('#tags'); checkBox.change(function(){ var s=[]; for(var i=0;i<checkBox.length;i++) if(checkBox[i].checked) s.push(checkBox[i].value); tagsBox.val(s.join('，')); });</script></form></body></html>