| 1234567891011121314151617181920212223242526272829303132333435363738394041424344 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="UTF-8">
- <title></title>
- </head>
- <body>
- <form action="" method="post">
- <label>你的爱好: </label>
- <input type="checkbox" name="fav">旅游
- <input type="checkbox" name="fav">游戏
- <input type="checkbox" name="fav">美食
- <input type="checkbox" name="fav">阅读
- <input type="checkbox" name="fav">睡觉
- <input type="checkbox" name="fav">其他
- <a href="javascript:void(0);">全选</a>
- <a href="javascript:void(0);">取消</a>
- <a href="javascript:void(0);">反选</a>
- </form>
- <script>
- (function() {
- var allAnchors = document.querySelectorAll('form a');
- var favList = document.querySelectorAll('input[name=fav]');
- allAnchors[0].addEventListener('click', function() {
- for (var i = 0; i < favList.length; i += 1) {
- // favList[i].setAttribute('checked', '');
- favList[i].checked = true;
- }
- });
- allAnchors[1].addEventListener('click', function() {
- for (var i = 0; i < favList.length; i += 1) {
- // favList[i].removeAttribute('checked');
- favList[i].checked = false;
- }
- });
- allAnchors[2].addEventListener('click', function() {
- for (var i = 0; i < favList.length; i += 1) {
- favList[i].checked = !favList[i].checked;
- }
- });
- })();
- </script>
- </body>
- </html>
|