當前位置：
首頁 >
前端技术
> javascript
>内容正文
javascript
JS - 获取选中复选框的值(checkBox)
生活随笔
收集整理的這篇文章主要介紹了
JS - 获取选中复选框的值(checkBox)
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
jquery的checkbox取值賦值選中
<html lang="us"> <head><meta charset="utf-8"><title>checkbox賦值測試</title><link type="text/css" href="<%=basePath%>/resources/css/jquery-ui/jquery-ui.css" rel="stylesheet" /></head> <body><h2>checkbox賦值測試</h2><br/><div class="form-group"><label>Checkboxes</label><br/><div class="checkbox"><label><input type="checkbox" ?name="chk" value="101">Checkbox 1</label></div><div class="checkbox"><label><input type="checkbox" ? name="chk" value="102">Checkbox 2</label></div><div class="checkbox"><label><input type="checkbox" ?name="chk" ?value="103">Checkbox 3</label></div><div class="checkbox"><label><input type="checkbox" ? name="chk" value="104">Checkbox 4</label></div><div class="checkbox"><label><input type="checkbox" ? name="chk" value="105">Checkbox 5</label></div></div><br/><button class="btn" ?? ?type="button" id="btnSelectAll">全選</button><button class="btn" ?? ?type="button" id="btnSelectNull">全不選</button><button class="btn" ?? ?type="button" id="btnSelect1and3">選1和3</button><button class="btn" ?? ?type="button" id="btnGetVal">取值</button></body> <script type="text/javascript" src="<%=basePath%>/resources/js/jquery/jquery-1.11.3.min.js"></script> <script type="text/javascript" src="<%=basePath%>/resources/js/jquery-ui/jquery-ui.js"></script> <script>$(function(){$("#btnSelectAll").click(function () {selectAll();});$("#btnSelectNull").click(function () {selectNull();});$("#btnSelect1and3").click(function () {select1and3();});$("#btnGetVal").click(function () {getVal();}); });function selectAll(){$("input[name='chk']").each(function(){ //$(this).attr("checked", true);this.checked=true;}); } function selectNull(){$("input[name='chk']").each(function(){ this.checked=false;}); } function select1and3(){//先清空選項selectNull();var sel = [];sel.push("101");sel.push("103");for(var i=0;i<sel.length;i++){$("input[name='chk']").each(function(){ if ($(this).val() == sel[i]) {this.checked=true;} });} } function getVal(){var chk_value =[];//定義一個數(shù)組 $('input[name="chk"]:checked').each(function(){//遍歷每一個名字為nodes的復選框，其中選中的執(zhí)行函數(shù) chk_value.push($(this).val());//將選中的值添加到數(shù)組chk_value中 });var groups = chk_value.join(",");alert(groups); }</script> </html> 方法一： if ($("#checkbox-id").get(0).checked) {// do something }方法二： if($('#checkbox-id').is(':checked')) {// do something }方法三： if ($('#checkbox-id').attr('checked')) {// do something } 判斷復選框是否被選中的代碼: 在jQuery1.6版本之后，取復選框有沒有被選中，要用prop $('#checkbox-id').prop('checked')//返回值是true或者false設置復選框是否為選中的代碼: $("input[name='selectit']").prop("checked",true/false)$("input[name='selectit']").prop("checked",$("#selectit").prop('checked')) len = $('.joblist input[type="checkbox"]' ).length; //獲取全部復選框數(shù)量 len_check = $('.joblist input:checked' ).length; //獲取被選中的數(shù)量總結(jié)
以上是生活随笔為你收集整理的JS - 获取选中复选框的值(checkBox)的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： mysql查看定时任务执行_mysql
- 下一篇： 小米商品详情HTML +CSS +JS