js和jquery判断checkbox是否被选中

js判断:

if(document.getElementById("checkboxID").checked){
    alert("checkbox is checked");
}

jquery判断:

$("input[type='checkbox']").is(':checked')

返回结果,选中:true,位选中:false

 

jQuery判断checkbox是否选中的3种方法

第一种:

if ($("#checkbox-id")get(0).checked) {
    // do something
}

第二种:

if($('#checkbox-id').is(':checked')) {
    // do something
}

第三种:

if ($('#checkbox-id').attr('checked')) {
    // do something
}

 

举个栗子:

例子里面包括了一下几个功能:

<input type="button" id="btn1" value="全选">
<input type="button" id="btn2" value="取消全选">
<input type="button" id="btn3" value="选中所有奇数"> 
<input type="button" id="btn4" value="反选"> 
<input type="button" id="btn5" value="获得选中的所有值"> 

<!DOCTYPE HTML> 
<html> 
<head> 
<title> New Document </title> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<SCRIPT LANGUAGE="JavaScript" src="http://www.cnjquery.com/demo/jquery.js"></script > 
<SCRIPT LANGUAGE="JavaScript"> 
$("document").ready(function(){ 
  $("#btn1").click(function(){ 
  $("[name='checkbox']").attr("checked",'true');//全选 
}) 
$("#btn2").click(function(){ 
  $("[name='checkbox']").removeAttr("checked");//取消全选 
}) 
$("#btn3").click(function(){ 
  $("[name='checkbox']:even").attr("checked",'true');//选中所有奇数 
}) 
$("#btn4").click(function(){ 
  $("[name='checkbox']").each(function(){ 
    if($(this).attr("checked")) { 
      $(this).removeAttr("checked"); 
    } else { 
      $(this).attr("checked",'true'); 
    } 
  }) 
}) 
$("#btn5").click(function(){ 
  var str=""; 
  $("[name='checkbox'][checked]").each(function(){ 
    str+=$(this).val()+""r"n"; 
    //alert($(this).val()); 
  }) 
  alert(str); 
  }) 
}) 
</SCRIPT> 
</head> 
<body> 
<form name="form1" method="post" action=""> 
<input type="button" id="btn1" value="全选"> 
<input type="button" id="btn2" value="取消全选"> 
<input type="button" id="btn3" value="选中所有奇数"> 
<input type="button" id="btn4" value="反选"> 
<input type="button" id="btn5" value="获得选中的所有值"> 
<br> 
<input type="checkbox" name="checkbox" value="checkbox1">checkbox1 
<input type="checkbox" name="checkbox" value="checkbox2">checkbox2 
<input type="checkbox" name="checkbox" value="checkbox3">checkbox3 
<input type="checkbox" name="checkbox" value="checkbox4">checkbox4 
<input type="checkbox" name="checkbox" value="checkbox5">checkbox5 
<input type="checkbox" name="checkbox" value="checkbox6">checkbox6 
<input type="checkbox" name="checkbox" value="checkbox7">checkbox7 
<input type="checkbox" name="checkbox" value="checkbox8">checkbox8 
</form> 
</body>
</html>

 

转载于:https://www.cnblogs.com/wangyongx/p/8066655.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值