zoukankan      html  css  js  c++  java
  • jQuery全选与反选,且解决点击只执行一次的问题

    <html>
    <head>
      <script src="jquery-1.11.1.min.js" type="text/javascript"></script>
    </head>
    <body>
      <input type="checkbox" name="chk_list[]" value="1" />1
      <input type="checkbox" name="chk_list[]" value="2" />2
      <input type="checkbox" name="chk_list[]" value="3" />3
      <input type="checkbox" name="chk_list[]" value="4" />4
      <input type="checkbox" name="chk_all" id="chk_all" />全选/取消全选
    
    <script type="text/javascript">
      $("#chk_all").click(function(){
          // 使用attr只能执行一次
          $("input[name='chk_list[]']").attr("checked", $(this).attr("checked")); 
        
          // 使用prop则完美实现全选和反选
          $("input[name='chk_list[]']").prop("checked", $(this).prop("checked"));

        // 获取所有选中的项并把选中项的文本组成一个字符串
          var str = '';
          $($("input[name='chk_list[]']:checked")).each(function(){
              str += $(this).next().text() + ',';
          });
          alert(str);   });
    </script> </body> </html>

    总结:

    • 对于HTML元素本身就带有的固有属性,在处理时,使用prop方法。
    • 对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法。
    • 参考 http://www.cnblogs.com/Showshare/p/different-between-attr-and-prop.html
  • 相关阅读:
    协同过滤算法
    redis雪崩,击穿,穿透
    scentos7安装redis,以及redis的主从配置
    centos7安装python3
    vm虚拟机安装centos7。克隆镜像以及快照
    全文检索django-haystack+jieba+whoosh
    drf的权限扩充
    redis分布式锁解决超卖问题
    Django结合Websocket进行WebSSH的实现
    vue-父子组件传参以及无限级评论
  • 原文地址:https://www.cnblogs.com/gentsir/p/4728712.html
Copyright © 2011-2022 走看看