jQuery实现列表的全选功能
只需要几行代码就可以实现列表的全选功能，并且可以配合post请求执行后台的删除程序
js
functionDelAlert(data)
{
if(data=='error')
{
alert("错误～");
}
elseif(data=='success')
{
alert("成功～");
location.reload();
}
}
//引入jquery，这里后台配合的是thinkphp
$(function(){
//每行的checkbox需要有check-value属性来存放当前行的id
//选中全部，checkAll为选中全部的checkbox的idselctone为每一行checkbox的class
$('#checkAll').selectall('selectone');
//删除选中，deleteAll为删除全部按钮的id selectone为每一行checkbox的class后台接收参数ids格式如：1,2,3
varurl="Home/Role/delall'";
$('#deleteAll').delselect('selectone',url,function(data){
DelAlert(data);
},function(){
layer.msg("没有选中内容",2,0);
});
})
jquery.selectall.js
(function($){
$.fn.selectall=function(className){
$(this).bind('click',function()
{
if($(this).attr('checked')=='checked')
{
$(this).attr("checked",false)
$('.'+className).attr('checked',false);
}else{
$(this).attr('checked','checked');
$('.'+className).attr('checked','checked');
}
});
$('.'+className).bind('click',function()
{
if($(this).attr('checked')=='checked')
{
$(this).attr("checked",false);
}else{
$(this).attr('checked','checked');
}
});
};
$.fn.delselect=function(className,url,fun,unselectfun){
$(this).bind('click',function(){
varselectid='';
$("."+className).each(function(){
if($(this).attr('checked')=='checked'){
selectid+=$(this).attr('check-value')+',';
}
});
if(selectid)
{
selectid=selectid.substring(0,selectid.length-1);
$.post(url,{ids:selectid},function(data){
fun(data);
});
}else
{
unselectfun();
}
});
};
})(jQuery);
以上所述就是本文的全部内容了，希望大家能够喜欢。