首页 > 编程语言 > 详细

JavaScript练习 - 正反选练习

时间:2018-10-26 18:44:54      阅读:161      评论:0      收藏:0      [点我收藏+]

正反选练习

<!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练习 - 正反选练习

原文:https://www.cnblogs.com/Anec/p/9857747.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!