< html> < head> < title> work. html< / title> < script type= "text/javascript" src= "js/jquery-3.2.1.js" > < / script> < script type= "text/javascript" > $ ( function ( ) { $ ( $ ( "#CheckedAll" ) ) . click ( function ( ) { var $isAllChecked = $ ( "#CheckedAll" ) . prop ( "checked" ) ; $ ( "input[name='items']" ) . prop ( "checked" , $isAllChecked) ; } ) ; $ ( "input[name='items']" ) . click ( function ( ) { var $allLen = $ ( "input[name='items']" ) . length; var $ckLen = $ ( "input[name='items']:checked" ) . length; $ ( "#CheckedAll" ) . prop ( "checked" , $allLen == $ckLen) ; } ) ; $ ( "#send" ) . click ( function ( ) { var $items = $ ( "input[name='items']:checked" ) ; for ( var i = 0 ; i < $items. length; i ++ ) { alert ( $items[ i] . value) ; } } ) ; } ) ; < / script> < / head> < body> < form> 你爱好的运动是?< input type= "checkbox" id= "CheckedAll" / > 全选/ 全不选< br/ > < input type= "checkbox" name= "items" value= "足球" / > 足球< input type= "checkbox" name= "items" value= "篮球" / > 篮球< input type= "checkbox" name= "items" value= "羽毛球" / > 羽毛球< input type= "checkbox" name= "items" value= "乒乓球" / > 乒乓球< br/ > < input type= "button" id= "send" value= "提 交" / > < / form> < / body>
< / html>