zoukankan      html  css  js  c++  java
  • js jqery判断checkbox是否选中,全选,取消全选,反选,选择奇数偶数项

    转载https://www.cnblogs.com/ooo0/p/6289391.html

    // 一,判断选中
      // 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()方法

  • 相关阅读:
    javascript一个重要知识点:事件。
    null和undifned的区别
    javascript中常用数组方法详细讲解
    在网站中数据缓存的重要性
    谈谈我对闭包知识的深刻理解
    FormData上传文件(不是所有的浏览器都支持)
    iframe+form表单提交数据
    伪AJAX
    ajax之发送post请求
    AJAX之发送GET请求
  • 原文地址:https://www.cnblogs.com/wen-zi/p/9224316.html
Copyright © 2011-2022 走看看