您的位置:首页 > 其它

jq 判断多个 checkbox 选中

2015-09-14 00:11 363 查看
效果如下:

  


html 代码:

  

<p>菜单:</p>
<div>
<input type="checkbox" name="menu" value="大盘鸡" />大盘鸡
<input type="checkbox" name="menu" value="红烧肉" />红烧肉
<input type="checkbox" name="menu" value="清蒸鱼" />清蒸鱼
<input type="checkbox" name="menu" value="大闸蟹" />大闸蟹
<input type="checkbox" name="menu" value="笨鸡蛋" />笨鸡蛋
<input type="checkbox" name="menu" value="白开水" />白开水
</div>
<span id="span"></span>


Jq 代码:

<script src="jquery/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
$(function () {
//获取层中所有的checkbox 注册单击事件
$("div input[type=checkbox]").click(function () {
//获取div下选中的 checkbox
var cks = $("div :checked");//属性过滤器
var leng = cks.length;//获取div下选中的 checkbox个数
var arr = []; //用户存放checkbox的value
//便利循环所有选中的 checkbox
cks.each(function (k, v) {  //k索引,v是对象
//把选中checkbox的value 存放起来
arr[arr.length] = $(v).val();;
});
$("#span").text("爷!您点的菜是:" + arr + " 共:" + leng + "个");
})
})
</script>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: