zoukankan      html  css  js  c++  java
  • jquery实现全选、反选、不选

    <!DOCTYPE html>
    <html lang="zh-CN">
    <head>
    <meta charset="UTF-8">
    <title>jquery实现全选、反选、不选</title>
    <script src="jquery-1.9.1.js"></script>
    <script>
    function checkAll(){
    $(":checkbox").prop("checked",true );
    }
    function checkNo(){
    $(":checkbox").prop("checked",false);
    }
    function checkRev(){
    $.each($(":checkbox"),function(){
    $(this).prop("checked",!$(this).prop("checked"));
    });
    }

    $(function(){
    var sec=$("body").append("<div></div>")//创建一个div追加到body里面
    var input="";//创建一个空的变量
    var arr=["井雨轩","小草","井小露","annie"];//创建一个数组,存放各个选项
    for(var i=0;i<4;i++){
    var index=i+1;
    input+="<input type='checkbox' name='标题"+index+ "'value="+arr[i]+">"+arr[i]+"<br>";
    }//把从0到4每一个创建的input收集到空变量里面
    sec.append(input);//再把这些收集到的所有input追加到div里面
    sec.append("<button onclick='checkAll()'>全选</button>");//创建全选按钮,并追加到div里面
    sec.append("<button onclick='checkNo()'>全不选</button>");//创建全不选按钮,并追加到div里面
    sec.append("<button onclick='checkRev()'>反选</button>");//创建反选按钮,并追加到div里面
    });
    </script>
    </head>
    <body>
    </body>
    </html>

  • 相关阅读:
    iOS socket编程 第三方库 AsyncSocket(GCDAsyncSocket)
    JS中reduce方法
    程序员的运动建议
    Vuex(三)—— getters,mapGetters,...mapGetters详解
    微信小程序之使用函数防抖与函数节流
    JS 异步(callback→Promise→async/await)
    圈子与网络
    社会经验4
    社会经验3
    爱情(。_。)大忌
  • 原文地址:https://www.cnblogs.com/annie211/p/5999553.html
Copyright © 2011-2022 走看看