在web前端做一些类似于用户数据提交的功能时,有时需要使用html复选框,让用户自定义和选择一些默认的项目。今天我们来谈谈如何用javascript和jquery来判断html复选框是否被选中。
判断javascript复选框是否被选中的方法
示例1:
<!--html代码--><input type="checkbox" name="green" onclick="Get(this)" />绿色<script> function Get(e){ //每次点击都会输出当前的状态 console.log(e.checked); }</script>
示例2:
<!--html代码--><input type="checkbox" name="green" onclick="Get()" />绿色<script> function Get(){ var check = document.getElementsByTagName('input')[0]; //每次点击都会打印出当前的状态 console.log(check.checked); }</script>
输出结果:
注意:
1.当复选框被选中时,输出true,否则输出false。
2.上面两个例子效果一样,只是调用的方法不同。
Jquery判断复选框是否被选中的方法
Jquery可以用is()和prop()来判断复选框是否被选中,这两个方法都很简单。
Is()方法确定复选框是否被选中:
<!--html代码--><input type="checkbox" name="host" id="mochu" />网站:http://***.feiniaomy.com<script> $('#mochu').click(function(){ console.log($(this).is(':checked')); });</script>
确定复选框是否被选中的prop()方法的代码:
<script> $('#mochu').click(function(){ console.log($(this).prop('checked')); });</script>
注意:prop()方法只能在jQuery版之后使用,1.6之前的版本会报错。
补充内容:
在jquery 1.6之前,attr()方法可以用来确定复选框是否被选中,但在1.6之后,attr()方***返回undefined。
示例代码:
$('mochu').attr('checked')
本文来自夜遇投稿,不代表舒华文档立场,如若转载,请注明出处:https://www.chinashuhua.cn/24/566918.html