zoukankan      html  css  js  c++  java
  • prop和attr的比较

    prop来获取或设置固有属性  removeProp()  删除固有属性

    attr来获取或设置自定义属性     removeAttr() 删除自定义属性

    案例:全选与全不选

    <body>
    <table border="1" cellpadding="5" cellspacing="0">
    <thead>
    <tr>
    <th><input type="checkbox" id="theadCheckbox"/>id</th>
    <th>姓名</th>
    <th>性别</th>
    <th>电话</th>
    <th>年龄</th>
    </tr>
    </thead>
    <tbody id="tbodyCheckbox">
    <tr>
    <td><input type="checkbox" id="" value="" name="boxs"/>1</td>
    <td>张三</td>
    <td>男</td>
    <td>18210528452</td>
    <td>20</td>
    </tr>
    <tr>
    <td><input type="checkbox" id=" " value=" " name="boxs"/>2</td>
    <td>张三</td>
    <td>男</td>
    <td>18210528452</td>
    <td>20</td>
    </tr>
    <tr>
    <td><input type="checkbox" id="" value="" name="boxs"/>3</td>
    <td>张三</td>
    <td>男</td>
    <td>18210528452</td>
    <td>20</td>
    </tr>
    <tr>
    <td><input type="checkbox" id=" " value=" " name="boxs"/>4</td>
    <td>张三</td>
    <td>男</td>
    <td>18210528452</td>
    <td>20</td>
    </tr>
    <tr>
    <td><input type="checkbox" id="" value="" name="boxs"/>5</td>
    <td>张三</td>
    <td>男</td>
    <td>18210528452</td>
    <td>20</td>
    </tr>
    </tbody>
    </table>

    </body>

    <script>

     $("#theadCheckbox").click(function(){

    var flag=$(this).is(":checked");

    if(flag){

    $("#tbodyCheckbox").find(":checkbox").prop("checked",true) 

    }else{

    $("#tbodyCheckbox").find(":checkbox").removeAttr("checked")

    })

    $("#tbodyCheckbox").find(":checkbox").click(function(){

    var checkedLength=$("#tbodyCheckbox").find(":checked").length;

    var checkboxLength=$("#tbodyCheckbox").find(":checkbox").length;

    if(checkboxLength==checkedLength){

    $("#theadCheckbox").prop("checked",true)

    }else{

    $("#theadCheckbox").removeAttr("checked")

    </script>

  • 相关阅读:
    net8:XML的读写操作【广告控件的XML文件实例】
    挺喜欢这个网站的
    问的问题的答案~
    zookeeper集群搭建
    solrCloud简介
    e3商城_day07
    solrj实现增删查
    solr后台管理界面-数据导入
    solr后台管理界面-增删改
    s5p6818 从SD卡启动程序(制作SD启动卡)
  • 原文地址:https://www.cnblogs.com/zousaili/p/8268249.html
Copyright © 2011-2022 走看看