jquery全选/jquery全不选/jquery反选

来源:互联网 发布:北京单身公寓 知乎 编辑:程序博客网 时间:2024/06/05 19:27
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head>    <title>全选,不全选,反选</title>    <script src="../js/jquery-1.6.2.min.js" type="text/javascript"></script>    <script language="javascript" type="text/javascript">        $(function () {            $("#selectAll").click(function () {//全选                $("#playList :checkbox").attr("checked", true);            });            $("#unSelect").click(function () {//全不选                $("#playList :checkbox").attr("checked", false);            });            $("#reverse").click(function () {//反选                $("#playList :checkbox").each(function () {                    $(this).attr("checked", !$(this).attr("checked"));                });            });        });    </script></head><body>    <div id="playList">        <input type="checkbox" value="歌曲1" />歌曲1<br />        <input type="checkbox" value="歌曲2" />歌曲2<br />        <input type="checkbox" value="歌曲3" />歌曲3<br />        <input type="checkbox" value="歌曲4" />歌曲4<br />        <input type="checkbox" value="歌曲5" />歌曲5<br />        <input type="checkbox" value="歌曲6" />歌曲6    </div>    <input type="button" value="全选" id="selectAll" />    <input type="button" value="全不选" id="unSelect" />    <input type="button" value="反选" id="reverse" /></body></html>

0 0