正反选练习

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <div>

        <input type="button" value="全选" onclick="f1()">

        <input type="button" value="反选" onclick="f2()">

        <input type="button" value="取消" onclick="f3()">

        <ul>

            <li><input type="checkbox">aaaaa</li>

            <li><input type="checkbox">aaaaa</li>

            <li><input type="checkbox">aaaaa</li>

            <li><input type="checkbox">aaaaa</li>

            <li><input type="checkbox">aaaaa</li>

            <li><input type="checkbox">aaaaa</li>

        </ul>

    </div>

    <script src="jquery-1.12.4.min.js"></script>

    <script>

        // function f1(){

        //     $(':checkbox').each(function () {

        //         $(this).prop('checked',true)

        //     })

        // }

        function f1(){

            $(':checkbox').prop('checked',true);

        }

        function f2(){

            $(':checkbox').each(function () {

                if ($(this).prop('checked')){

                    $(this).prop('checked',false)

                }

                else {

                    $(this).prop('checked',true)

                }

            })

        }

        function f3(){

            $(':checkbox').removeProp("checked");

        }

    </script>

</body>

</html>

JavaScript练习 - 正反选练习的更多相关文章

  1. JavaScript打印正倒直线

    做了一个作业,用JavaScript打印正倒直线,突然觉得自己还是逻辑有待加强训练啊 document.write("<h3>打印倒正金字塔直线</h3>" ...

  2. jquery下的正反选操作

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. [ javascript ] 司徒正美的fadeOut-fadeIn效果!

    首先感谢司徒正美的文章! 在司徒大神的博客看到一个简单的渐入渐出的效果.全然採用js实现. 例如以下: <!doctype html> <html dir="ltr&quo ...

  4. javascript 全选 反选 js代码

    <script type="text/javascript"> //全选function checkAll() { var objs = window.document ...

  5. JavaScript使用正則表達式

    2.0 简单介绍 正則表達式是能够用来查找与给定模式匹配的文本的搜索模式.比如,在上一章中,我们在一个较长的字符串中查找子字符串Cookbook: var testValue = "This ...

  6. 【JavaScript】正則表達式

    正則表達式,也不是第一次与它见面了.在我们学习ASP.NET视频的时候,验证控件的那个实例中.就有提到过它. 那个时候.都是在控件的属性中自己设置的,用的原理就是正則表達式,当时得感觉就是方便,强大, ...

  7. JavaScript之正則表達式入门

    <html> <head><title>Js String 正則表達式</title><script>//边界符 js 中直接定义须要边界符 ...

  8. 用jquery来实现正反选选择框checkbox的小示例

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. jQuery 全选 正反选

    <script src="http://code.jquery.com/jquery-1.4.4.min.js" type="text/javascript&quo ...

随机推荐

  1. BZOJ1299[LLH邀请赛]巧克力棒——Nim游戏+搜索

    题目描述 TBL和X用巧克力棒玩游戏.每次一人可以从盒子里取出若干条巧克力棒,或是将一根取出的巧克力棒吃掉正整数长度.TBL先手两人轮流,无法操作的人输. 他们以最佳策略一共进行了10轮(每次一盒). ...

  2. BZOJ5101[POI2018]Powódź——并查集

    题目描述 在地面上有一个水箱,它的俯视图被划分成了n行m列个方格,相邻两个方格之间有一堵厚度可以忽略不计的墙,水 箱与外界之间有一堵高度无穷大的墙,因此水不可能漏到外面.已知水箱内每个格子的高度都是[ ...

  3. 【Linux】Centos配置ssh无密码登录

    [测试环境] 刚好重新做mgr就搞下吧,主要论文好长~想多做几遍再看~ master1 192.168.13.111 master2 192.168.13.112  master3  192.168. ...

  4. sql server 小技巧(1) 导入csv数据到sql server

    1. 右击 DataBaseName,选择 Tasks->Import Data 2. 选择数据源: Flat File Source , 选择一个csv文件 Advance: 选择所有的列,改 ...

  5. activity之间的数据传递方法

    1  基于消息的通信机制 Intent--------boudle,extra 用这种简单的形式,一般而言传递一些简单的类型是比较容易的,如int.string等 详细介绍下Intent机制 Inte ...

  6. [poj1275][Cashier Employment]

    poj1275 题目大意: 每天有24小时,每个小时需要一定的人.有m个人每个人会有一个开始工作的时间,每个人会工作8小时,问至少需要多少人才能完成任务.如果这m个人也不能完成任务就输出"N ...

  7. 2018 ACM 网络选拔赛 沈阳赛区

    B. Call of Accepted #include <cstdio> #include <cstdlib> #include <cmath> #include ...

  8. codeblocks下的汇编语言

    Debug->Debugging windows->Disassembly F4+F7 每条语句的调试,查看变量 可以通过两者的比较来互相学习 1.通过查看汇编代码学习c如何改进,减少代码 ...

  9. 关于Picasso load本地图片显示失败的探究

    今天测试找过来说图片不显示了,查了一下是Picasso加载本地图片没有显示,奇怪了,以前都是这样写为什么现在不行了,难道是Picasso有bug了,怀着激动的心情断点跟进去发现 Picasso所有lo ...

  10. 到浏览器顶部的获取js和jquery

    获取当前窗口到页面顶端高度: js: document.documentElement.scrollTop JQ:$(document).scrollTop()或者$(window).scrollTo ...