zoukankan      html  css  js  c++  java
  • Jquery获取checkbox属性checked为undefined

    说明:本文来自新浪博客,因为无法收藏,故直接copy过来备注,以后好查询

    原网址:http://blog.sina.com.cn/s/blog_6810dfc20101jddq.html

    使用jQuery v1.10.2获取checkbox的状态时,用.attr("checked")时输出总是为undefined.郁闷了,这难道是个bug?!

    查看jQuery API的文档,发现:

    As of jQuery 1.6, the .attr() method returns undefined for attributes that have not been set. In addition, .attr() should not be used on plain objects, arrays, the window, or the document. To retrieve and change DOM properties, use the .prop() method.

    The difference between attributes and properties can be important in specific situations. Before jQuery 1.6, the .attr() method sometimes took property values into account when retrieving some attributes, which could cause inconsistent behavior. As of jQuery 1.6, the .prop() method provides a way to explicitly retrieve property values, while .attr() retrieves attributes.

    也就说:v1.6以后attr(‘checked’)就返回checked和undefined,v1.6以前返回true和false,v1.6以后可以使用is(‘:checked’)或者.prop(‘checked’)来返回true和false

    总结:

    (1)获取checked的方法

        .attr('checked'):  
        .prop('checked'): //1.6+:true/false
        .is(':checked'):   

    (2)checked赋值

         所有的jquery版本都可以这样赋值:
         .attr("checked","checked");
         .attr("checked",true);

          jquery1.6以上版本的:
         .prop("checked",true);

        .prop("checked","checked");
        .prop({checked:true});
         .prop("checked",function(){
                  return true;
          });

    (3)note:jquery1.6以上才存在prop();

    checkbox操作:

    <input id="cbxAll" type="checkbox" title="全选" name="cbxAll" onclick="CheckAll()" />
    <input id="cbx1" type="checkbox" title="单选" name="cbxType" onclick="CheckOne()"/>
    function CheckAll() {
        var checkall = $("#cbxAll").prop("checked");
        if (checkall) {
        //全选 $(
    "input:checkbox[name='cbxType']").prop("checked", true); } else {
        //取消全选 $(
    "input:checkbox[name='cbxType']").prop("checked", false); } }
    function CheckOne() {
      $("#cbxAll").prop("checked",false);
    }
    var checkedboxes = $("input:checkbox[name='cbxType']:checked");
  • 相关阅读:
    颜色代码 #000~#FFF & DML案例设计
    SQLScript DML 创建 & 查询 & 序列(条件查询 日起查询 关联查询 子查询 分组查询 查询内容拼接 模糊查询)
    Java JDBC 连接数据库 Demo
    document的JavaScript一些用法
    dxSpreadSheet的报表demo-关于设计报表模板问题
    dxSpreadSheet的报表demo-关于设计报表模板的Datagroup问题
    TJSON的烦人的泄漏
    dxSpreadSheet的报表
    TDXSpreadSheet中自定义公式函数三大步骤
    SVN项目监视器的配置文件
  • 原文地址:https://www.cnblogs.com/zhyue93/p/checkbox.html
Copyright © 2011-2022 走看看