全选

作者: PeppaTang | 来源:发表于2018-08-28 20:55 被阅读0次
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>全选</title>
        <script src="../../day05/jquery/jquery-1.11.3.min.js"></script>
    </head>
    <body>
        <li><input type="checkbox">猫和老鼠</li>
        <li><input type="checkbox">樱桃小丸子</li>
        <li><input type="checkbox">足球小子</li>
        <li><input type="checkbox">七龙珠</li>
        <li><input type="checkbox">美少女战士</li>
        <li><input type="checkbox">天线宝宝</li>
        <li><input type="checkbox">海尔兄弟</li>
        <li><input type="checkbox">葫芦娃</li>
        <li><input type="checkbox">大头儿子小头爸爸</li>
        <li><input type="checkbox">蜡笔小新</li>
        <li><input type="checkbox">十二生肖</li>
        <button>全选</button>
        <button>全不选</button>
        <button>反选</button>
    </body>
    </html>
    <script>
    
    $('button:eq(1)').click(function () {
        $('input').prop('checked', false)
    })
    $('button').eq(2).click(function () {
        // 给每一个input都执行each里面匿名函数的操作
        // 如果写了一个参数i,代表当前遍历的是第i个元素
        $('input').each(function (i) {
            // 首先取出来当前这个input的状态
            var state = $(this).prop('checked')
            $(this).prop('checked', !state)
        })
    })
    </script>
    

    相关文章

      网友评论

          本文标题:全选

          本文链接:https://www.haomeiwen.com/subject/uefcwftx.html