jQuery實(shí)現(xiàn)列表的全選功能
更新時(shí)間:2015年03月18日 11:20:47 投稿:hebedich
本文給大家分享的是使用jquery實(shí)現(xiàn)的全選刪除插件的代碼,非常的實(shí)用,本文示例是結(jié)合的ThinkPHP,小伙伴們可以自由擴(kuò)展。
只需要幾行代碼就可以實(shí)現(xiàn)列表的全選功能,并且可以配合post請(qǐng)求執(zhí)行后臺(tái)的刪除程序
js
復(fù)制代碼 代碼如下:
function DelAlert(data)
{
if(data == 'error')
{
alert("錯(cuò)誤~");
}
else if(data == 'success')
{
alert("成功~");
location.reload();
}
}
//引入jquery,這里后臺(tái)配合的是thinkphp
$(function(){
//每行的checkbox需要有check-value屬性來存放當(dāng)前行的id
//選中全部,checkAll 為選中全部的checkbox的id selctone 為每一行checkbox的class
$('#checkAll').selectall('selectone');
//刪除選中,deleteAll為刪除全部按鈕的id selectone 為每一行checkbox的class 后臺(tái)接收參數(shù)ids 格式如: 1,2,3
var url = "Home/Role/delall'";
$('#deleteAll').delselect('selectone',url,function(data){
DelAlert(data);
},function(){
layer.msg("沒有選中內(nèi)容",2,0);
});
})
jquery.selectall.js
復(fù)制代碼 代碼如下:
(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(){
var selectid = '';
$("."+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 );
以上所述就是本文的全部內(nèi)容了,希望大家能夠喜歡。
相關(guān)文章
基于jquery的動(dòng)態(tài)創(chuàng)建表格的插件
工作快一年了,最近學(xué)習(xí)jquery,對(duì)jquery很感興趣。第一次寫博客,有不足之處還請(qǐng)各位拍磚。2011-04-04jquery使用remove()方法刪除指定class子元素
這篇文章主要介紹了jquery使用remove()方法刪除指定class子元素的方法,可實(shí)現(xiàn)刪除指定元素下指定class的子元素功能,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-03-03一個(gè)簡單的動(dòng)態(tài)加載js和css的jquery代碼
動(dòng)態(tài)加載js和css的jquery,可用于在生成頁面時(shí)通過js函數(shù)加載一些共通的js和css文件,需要的朋友可以參考下2014-09-09jQuery實(shí)現(xiàn)的簡單動(dòng)態(tài)添加、刪除表格功能示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)的簡單動(dòng)態(tài)添加、刪除表格功能,涉及jQuery事件響應(yīng)及表格元素動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2017-09-09