zoukankan      html  css  js  c++  java
  • 多选全选框使用addEvenListener实现

    第一步,既然是全选和多选,那么一定需要鼠标去点击,那么我就先分别获取它们的id,然后给它们加个点击事件

               //获取全选框的id
          var allCheck = document.getElementById("allCheck");
           //添加点击事件 allCheck.addEventListener(
    "click",clickHandler);
           //获取其他选择框的id
    for(var i = 1 ;i < 5;i++){ var check = document.getElementById("check"+i);
              //添加点击事件
    this.addEventListener("click",clickHandler); }

     第二步,执行点击事件这个函数

    function clickHandler(e){
              //判断当前是不是全选框
    if(this == allCheck){ for(var i = 1; i < 5;i++){ var check = document.getElementById("check"+i); check.checked = allCheck.checked; } } var bool = true; for(var i = 1; i < 5;i++){ var check = document.getElementById("check"+i); if(!check.checked) bool = false; } allCheck.checked =bool; }

    效果:

  • 相关阅读:
    1015词法分析
    0909作业
    华为云专家来公司
    SVN与Git的优点差异比较
    eclipse快捷键大全
    Servlet,HttpServletRequest 和 HttpServletResponse
    XML
    JDBC
    XMIND快捷键
    java数据
  • 原文地址:https://www.cnblogs.com/MySweetheart/p/12287976.html
Copyright © 2011-2022 走看看