判断input是否被选中
今天处理了一个input被选中的问题,所以今天就谢谢input被选中的一些js相关的问题吧。
input的被选中属性叫做checked。
checked是input的多选框type=”checkbox”、单选框type=”radio”的属性。
checked在JS里面有两个属性:
1、选中的时候是true
2、不被选中的是false
到这里的时候很多人已经知道怎么去判断input是否被选中怎么写了。
首先咱们先写一个布局,尽量简单点:
<div id="box">
<input type="checkbox"/><br/>(www.gendan5.com)
<input type="checkbox"/><br/>
<input type="radio"/><br/>
<input type="radio"/><br/>
</div>
<button id="button1">JQ方法</button>
<button id="button2">原生JS方法</button>
为了大家的方便理解我使用原生JS和JQ都写一个把。在input被选中上其实原生JS更为直接和有效率(个人看法)
先来JQ判断input被选中的吧:
$(function () {
$('#button1').click(function () {
$('#box input').each(function (index) {
if ($(this).get(0).checked == true){
console.log('第' + index + 'input被选中了');
}else{
console.log('第' + index + 'input没被选中');
};
});
});
});
这个代码只能算中规中矩,不算太烂也不算太好,其实咱们可以使用for循环更好,当然JQ的each是一个特别强大的属性,所以这里就用each吧。
下面是原生JS的方法判断input被选中:
var box = document.getElementById('box');
var inputs = box.getElementsByTagName('input');
var button2 = document.getElementById('button2');
button2.onclick = function () {
for (var i=0; i<inputs.length; i++){
if (inputs[i].checked == true){
console.log('第' + i + 'input被选中了');
}else{
console.log('第' + i + 'input没被选中');
};
};
};
这个代码我还是比较满意的,如果你的项目是原生JS来写的倒是可以使用这个代码呢。
- 点赞
- 收藏
- 分享
- 文章举报
- 关Jquery判断input type="checkbox"元素是否被选中的判断
- html之radio是否被选中的判断------radio只是input的type属性
- 判断一个数组中的input选择按钮中是否有被选中的已经选中了哪几个
- 判断复选框是否被选中
- js判断input checked是否被选中代码实例
- js判断input中是否有值问题
- 判断checkbox是否被选中
- jquery中判断checkbox是否被选中的方法
- 自己的判断是否在时间内的函数,用于禁用input、radio等
- jquery如何判断checkbox(复选框)是否被选中
- 判断2个input值是否有值存在,有才能被提交
- jquery判断radio或者checkbox是否被选中
- 【js小方法】提交表单是,判断单选框是否被选中
- 如何判断一组同名radio中是否有一个被选中
- jQuery中如何判断复选框是否被选中
- JS判断单个checkbox是否被选中
- jQuery 判断 checkbox 是否被选中的几种方法
- 判断radio 是否被选中
- ajax判断某个input输入文本框是否为空
- jquery判断input checkbox是否选择 select下拉列表选择的value