正反选练习

<!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. MT【8】和e有关的一个极限

    解答: 评:这里涉及到e有关的极限的单调性,求导数得:

  2. CQOI2009叶子的染色

    叶子的染色 题目描述 给一棵m个结点的无根树,你可以选择一个度数大于1的结点作为根,然后给一些结点(根.内部结点和叶子均可)着以黑色或白色.你的着色方案应该保证根结点到每个叶子的简单路径上都至少包含一 ...

  3. POJ 1958 Strange Towers of Hanoi 解题报告

    Strange Towers of Hanoi 大体意思是要求\(n\)盘4的的hanoi tower问题. 总所周知,\(n\)盘3塔有递推公式\(d[i]=dp[i-1]*2+1\) 令\(f[i ...

  4. Java NIO -- 通道 Channel

    通道(Channel):由 java.nio.channels 包定义的.Channel 表示 IO 源与目标打开的连接.Channel 类似于传统的“流”.只不过 Channel本身不能直接访问数据 ...

  5. wildfly jobss 同时连接多个数据源 datasource xa-datasource

    由于需要从一个远程机器取数据.处理后保存到本地数据库处理.用 wildfly datasource 会报: [com.arjuna.ats.arjuna] (default task-6) ARJUN ...

  6. Android打造(ListView、GridView等)通用的下拉刷新、上拉自动加载的组件

    原文 http://blog.csdn.net/bboyfeiyu/article/details/39253051       前言 下 拉刷新组件在开发中使用率是非常高的,基本上联网的APP都会采 ...

  7. Ubuntu16.04创建electronic-wechat启动器图标

    步骤 将最新的electronic-wechat二进制包,下载解压,并移动到/opt/下面.sudo cp -r electronic-wechat/ /opt/electronic-wechat/ ...

  8. Boost filessystem...

    CMakeList.txt: cmake_minimum_required(VERSION 3.8) project(Demo) ) set(SOURCE_FILES main.cpp) //需要添加 ...

  9. nginx设置反向代理后端jenklins，页面上的js css文件无法加载

    转载 2017年06月14日 22:36:59 8485 问题现象: nginx配置反向代理后,网页可以正常访问,但是页面上的js css文件无法加载,页面样式乱了. (1)nginx配置如下: (2 ...

  10. rabbitmq用户授权

    创建用户 rabbitmqctl add_user kye01 123456 设置用户角色 rabbitmqctl set_user_tags kye01 monitoring 查看用户清单 rabb ...