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 class="item">
<table border="1" >
<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>
分享到：
相关推荐
主要介绍了jQuery操作复选框(CheckBox)的取值赋值实现代码,需要的朋友可以参考下
本篇文章主要是对jQuery中的RadioButton,input,CheckBox取值赋值实现代码进行了介绍，需要的朋友可以过来参考下，希望对大家有所帮助
修改checkbox时..jquery在取checked值时总是出这样那样的问题....各个版本之间还有少许的差异....当向后台发送数据后,,再返回到当前页时..checked的状态始终不对
jquery radio取值，checkbox取值，select取值，radio选中，checkbox选中，select选中，及其相关 获取一组radio被选中项的值 var item = $(‘input[name=items][checked]’).val(); 获取select被选中项的文本 var ...
本篇文章主要是对jQuery操作CheckBox的方法(选中,取消,取值)进行了介绍，需要的朋友可以过来参考下，希望对大家有所帮助
我们主要看下如何通过jQuery来获取CheckBoxList成员内容
主要的讲解jquery radio取值，checkbox取值，select取值，radio选中，checkbox
下面小编就为大家带来一篇jquery获取复选框checkbox的值的简单实现方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
包括最常用的表单操作，取值赋值清空，比较实用，比较简单。包括input,textarea,radio,checkbox,select.另外根据select的文本值text来让select选中。
jquery radio取值，checkbox取值，select取值，radio选中，checkbox选中，select选中，及其相关 获取一组radio被选中项的值 var item = $('input[@name=items][@checked]').val(); 获取select被选中项的文本 var...
随着Jquery的作用越来越大，使用的朋友也越来越多。在Web中，由于CheckBox、 Radiobutton 、 DropDownList等控件使用的频率比较高，就关系到这些控件在Jquery中的操作问题
jQuery select checkbox radio等基本操作，包括的取值
jquery radio取值，checkbox取值，select取值，radio选中，checkbox选中，select选中，及其相关 获取一组radio被选中项的值 var item = $(‘input[@name=items][@checked]’).val(); 获取select被选中项的文本 var ...
jquery radio取值，checkbox取值，select取值，radio选中，checkbox选中，select选中，及其相关 获取一组radio被选中项的值 var item = $(‘input[name=items][checked]’).val(); 获取select被选中项的文本 var ...
jquery取radio单选按钮的值 代码如下: $(“input[name=’items’]:checked”).val(); 另：判断radio是否选中并取得选中的值 ...jquery radio取值，checkbox取值，select取值，radio选中，c