js jqery判断checkbox是否选中,全选,取消全选,反选,选择奇数偶数项

时间:2023-03-08 22:58:15
js jqery判断checkbox是否选中,全选,取消全选,反选,选择奇数偶数项
  // 一,判断选中
  // js
var ischecked2 = function(){
// this.checked == true
$(document.getElementsByTagName("input")).each(function(i){
if(this.checked == true){
console.log(this.getAttribute('name'));
}
})
} // jquery
var ischecked1 = function(){
// 方法1,$(this).is(':checked')
$("input[type='checkbox']").each(function(i){
if($(this).is(':checked') == true){
console.log($(this).attr("name"));
}
});
// 方法2.$(this).get(0).checked
$("input[type='checkbox']").each(function(i){
if($(this).get(0).checked == true){
console.log($(this).attr("name"));
}
});
// 方法3.$(this).prop('checked')
$("input[type='checkbox']").each(function(i){
if($(this).prop('checked')){
console.log($(this).attr("name"));
}
}); } // 二,全选
// jquery
var selectAll1 = function(){
// $("[type='checkbox']").prop("checked",true); // 方法1
$("[type='checkbox']").prop("checked","checked"); // 方法2
}
// js
var selectAll2 = function(){
$(document.getElementsByTagName("input")).each(function(i){
this.checked = true;
})
} // 三,取消全选
// jquery
var selectNone1 = function(){
// $("[type='checkbox']").prop("checked",false); // 方法1
$("[type='checkbox']").prop("checked",""); // 方法2
}
// js
var selectNone2 = function(){
$(document.getElementsByTagName("input")).each(function(i){
this.checked = false;
})
} // 四,反选
// jquery
var inverse1 = function(){
$("[type='checkbox']").each(function () {
$(this).prop("checked", !$(this).prop("checked"));
});
}
// js
var inverse2 = function(){
$(document.getElementsByTagName("input")).each(function(i){
this.checked = !this.checked;
})
} // 五,jquery 选中所有奇数 (index从0开始)
var odd1 = function(){
selectNone1();
$("[type='checkbox']:odd").prop("checked",'true');
} // 六,jquery 选中所有偶数 (index从0开始)
var even1 = function(){
selectNone1();
$("[type='checkbox']:even").prop("checked",'true');
}

备注:在jQuery 1.6中,.attr()方法查询那些没有设置的属性,则会返回一个undefined。如果你要去恢复或者改变DOM状态值,类似checked,selected,disabled等表单元素的状态,最好使用.prop()方法。