js 全选全不选反选提交

来源：未知责任编辑：责任编辑发表时间:2015-01-01 13:15　点击:次

ASP PHP JSP JavaScript 网页设计 DIVCSS Ajax技术 HTML5

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>

<script src="../scripts/jquery-1.3.1.js" type="text/javascript"></script>
<script type="text/javascript">
   $(function(){
      //全选
      $("#CheckedAll").click(function(){
          $('[name=items]:checkbox').attr('checked', true);
      });
      //全不选
      $("#CheckedNo").click(function(){
         $('[type=checkbox]:checkbox').attr('checked', false);
      });
      //反选
      $("#CheckedRev").click(function(){
           $('[name=items]:checkbox').each(function(){
             //此处用JQ写法颇显啰嗦。体现不出JQ飘逸的感觉。
             //$(this).attr("checked", !$(this).attr("checked"));

             // www.2cto.com 直接使用JS原生代码，简单实用
             this.checked=!this.checked;
           });
      });
      //输出值
     $("#send").click(function(){
         var str="你选中的是：\r\n";
         $('[name=items]:checkbox:checked').each(function(){
             str+=$(this).val()+"\r\n";
         })
         alert(str);
     });
   })

   </script>
</head>
<body>
<form method="post" action="">
    你爱好的运动是？
    <br/>