我们处理数据时，最好能够支持全选操作。
选中之后，进行删除，或其他处理。
我自己写了一个demo。
主要功能：
1.点击全部选中
2.点击全部取消
3.然后进行获取选中的id，进行处理
代码如下：
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
<script src="./js/jquery-1.4.2.min.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="./css/demo.css">
<script type="text/javascript">
$(document).ready(function(){
//单击全选
$("#checkall").click(function(){
if($(this).attr("checked")){
$("input[name='mailid']").attr("checked", true);
}else{
$("input[name='mailid']").attr("checked", false);
}
}); //删除
$("#quick_del").click(function(){
var arrMailid = new Array();
$("input[name='mailid']").each(function(i){
if($(this).attr("checked")){
arrMailid.push($(this).val());//添加到数组中
}
});
strMailid = arrMailid.join("-");
//alert(arrMailid instanceof Array);//判断是否为数组格式
del(strMailid);
});
});
//删除,只进行处理，不参与元素争端
function del(mailid){
//或者ajax处理
//或者跳转处理
} </script>
</head>
<input type="checkbox" name="checkall" id="checkall" title="选中/取消选中"><br>
<input type="checkbox" name="mailid" value=""><br>
<input type="checkbox" name="mailid" value=""><br>
<input type="checkbox" name="mailid" value=""><br>
<input type="checkbox" name="mailid" value=""><br>
<input type="checkbox" name="mailid" value=""><br> <a class="btn_gray btn_space" hidefocus="" id="setAllReaded" onclick="getTop();" href="javascript:;">全部标为已读</a> <a class="btn_gray btn_space" hidefocus="" id="quick_del" href="javascript:;" name="del">删除</a> </html>
相关的css代码：
.btn_gray{
border: 1px solid #;
color: #;
color: #!important;
background: #F3F3F3;
background: -moz-linear-gradient(top,#ffffff %,#ebebeb %,#F3F3F3 %);
background: -webkit-linear-gradient(top,#ffffff %,#ebebeb %,#F3F3F3 %);
background: -o-linear-gradient(top,#ffffff %,#ebebeb %,#F3F3F3 %);
background: -ms-linear-gradient(top,#ffffff %,#ebebeb %,#F3F3F3 %);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff',endColorstr='#d7d7d7',GradientType= );
background: linear-gradient(top,#ffffff %,#ebebeb %,#F3F3F3 %);
}
.btn_space {
margin-right: 3px;
}
a:hover {
text-decoration: underline;
}
body {
font-family: "lucida Grande",Verdana;
font-size: 12px;
}
这里是把a标签处理成按钮的样式的写法。