js 分页全选或反选标识实现代码

 更新时间:2011年08月09日 00:02:48   作者:  
分页全选或反选标识 对多选按钮操作。 批量全选添加、批量移除。 行单选添加、移除。 分页之后(全选或不选)状态标识依然存在
注:对多选按钮操作。
1:批量全选添加、批量移除。
2:行单选添加、移除。
3:分页之后(全选或不选)状态标识依然存在
复制代码 代码如下:

/* *****>****>tr单选事件
------------------------------------------------------------------------------------*/
$("#ajaxshowmdqhList tbody tr").live("click",function(){
sx_tr_Value($(this),false,"");
});
/* 筛选重复值
------------------------------------------------------------------------------------*/
var cgdd_id_List="";
var array=new Array();
var is_add_id=true;
var sx_tr_Value=function(obj,all_checked,ck_value)
{
cgdd_id_List = $("#hfselectitemid").val();
if(!$(obj).find("input").attr("checked"))
{
$(obj).find("input").attr("checked","checked");
array=$("#hfselectitemid").val().split(":");
for(var i=0;i<array.length;i++)
{
if(array[i]==$(obj).attr("id"))
{
is_add_id=false;
}
}
if(is_add_id)
{
cgdd_id_List +=$(obj).attr("id")+":";
}
}
else
{
$(obj).find("input").attr("checked",false);
array=cgdd_id_List.split(":");
cgdd_id_List="";
for(var i=0;i<array.length;i++)
{
if(array[i]!=$(obj).attr("id")&&array[i]!="")
{
cgdd_id_List +=array[i]+":";
}
}
}
$("#hfselectitemid").val(cgdd_id_List);
array = SortArr($("#hfselectitemid").val());// 排序
cgdd_id_List="";
for(var k=0;k<array.length;k++)
{
if(array[k]!=""&&array[k]!=":")
{
cgdd_id_List+=array[k]+":";
}
}
$("#hfselectitemid").val(cgdd_id_List);
alert($("#hfselectitemid").val());
}
/* ***>****>[全选/全不选事件]
------------------------------------------------------------------------------------*/
$("#ajaxshowmdqhList input[name=cgdd_checked_all]").live("click",function(){
var ck=$(this).attr("checked");
var is_add_ckItem=false;// 是否添加到已选择id集合中
var all_ck_item = new Array(); // 已选择ID集合
var not_all_ck_item=new Array();// 反选ID集合
all_ck_item = $("#hfselectitemid").val().split(":");
$("input[name=cg_state]").each(function(){
$(this).attr("checked",ck);
});// 结束
cgdd_id_List="";
$("#ajaxshowmdqhList tbody tr").find("input").each(function(i){
if($(this).attr("checked"))// 全选添加ID
{
for(var i = 0; i<all_ck_item.length; i++)
{
if(all_ck_item[i]==$(this).attr("id"))
{
is_add_ckItem=true;
break;
}
}
if(!is_add_ckItem)
{
cgdd_id_List += $(this).attr("id")+":";
}
is_add_ckItem = false;
}
else // 反选ID
{
not_all_ck_item[i]=$(this).attr("id");
}
});// 结束
// 移除反选ID
for(var i = 0; i<all_ck_item.length; i++)
{
for(var k = 0; k<not_all_ck_item.length; k++)
{
if(all_ck_item[i]==not_all_ck_item[k])
{
is_add_ckItem=true;
break;
}
}
if(!is_add_ckItem)
{
if(all_ck_item[i]!=":"&&all_ck_item[i]!="")
{
cgdd_id_List += all_ck_item[i]+":";
}
}
is_add_ckItem = false;
}
$("#hfselectitemid").val(cgdd_id_List);
var Sort_array = new Array();
Sort_array = SortArr($("#hfselectitemid").val());// 排序
cgdd_id_List="";
for(var k=0;k<Sort_array.length;k++)
{
if(Sort_array[k]!=""&&Sort_array[k]!=":")
{
cgdd_id_List+=Sort_array[k]+":";
}
}
$("#hfselectitemid").val(cgdd_id_List);
cgdd_id_List= "";
alert($("#hfselectitemid").val());
});// 结束
/* 冒泡排序
------------------------------------------------------------------------------------*/
var SortArr=function(id_list)
{
var sortArray=new Array();
var temp;
sortArray=id_list.split(":");
for(var i=0;i<sortArray.length;i++)
{
for(var j=0;j<i;j++)
{
if(parseInt(sortArray[j])>parseInt(sortArray[i]))
{
temp=sortArray[j];
sortArray[j]=sortArray[i];
sortArray[i]=temp;
}
}
}
temp="";
return sortArray;
} // 结束

相关文章

  • javascript之典型高阶函数应用介绍

    javascript之典型高阶函数应用介绍

    这几个方法均为javascript 1.6 数组新增的方法。是很典型的functional 函数,当然也非常实用。下面是functional的定义并不来自javascript
    2013-01-01
  • js实现连个数字相加而不是拼接的方法

    js实现连个数字相加而不是拼接的方法

    这篇文章主要介绍了js如何实现连个数字相加而不是拼接,需要的朋友可以参考下
    2014-02-02
  • js省市县三级联动效果实例

    js省市县三级联动效果实例

    这篇文章主要介绍了js实现简单的省市县三级联动效果,以完整实例形式分析了JavaScript实现省市县三级联动效果的具体步骤与相关实现技巧,需要的朋友可以参考下
    2016-05-05
  • js实现九宫格抽奖

    js实现九宫格抽奖

    这篇文章主要为大家详细介绍了js实现九宫格抽奖,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-03-03
  • 详解ant-design-pro使用qiankun微服务

    详解ant-design-pro使用qiankun微服务

    这篇文章主要介绍了ant-design-pro使用qiankun微服务详解,其实微服务需要有主应用和子应用, 一个子应用可以配置多个相关联的主应用,配置方法都是一样的,对ant-design-pro微服务配置相关知识,感兴趣的朋友一起看看吧
    2022-03-03
  • js实现图片上传预览原理分析

    js实现图片上传预览原理分析

    这篇文章主要为大家详细介绍了js实现图片上传预览的原理,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07
  • javascript实现简单的html5视频播放器

    javascript实现简单的html5视频播放器

    网页视频音频播放器大家并不陌生,在IE中我们可以运行ActiveX来嵌入微软的Media Player或者其他的本地播放器,当然可能大部分我们都是使用Flash来制作播放器。在HTML5发展迅速的今天,让我们尝试用HTML5来制作网页播放器吧,毕竟无论是PC还是移动设备,HTML5是未来的趋势
    2015-05-05
  • JavaScript获取元素尺寸和大小操作总结

    JavaScript获取元素尺寸和大小操作总结

    本文总结了使用JavaScript获取指定元素大小、位置的几种方式。如果你用的是JQuery,则获取元素大小是非常简单的。但是我们还是有必要知道如何通过原生JavaScript来获取,需要的朋友可以参考下
    2015-02-02
  • 详解ES7 Decorator 入门解析

    详解ES7 Decorator 入门解析

    这篇文章主要介绍了详解ES7 Decorator 入门解析,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-02-02
  • 理解JavaScript表单的基础知识

    理解JavaScript表单的基础知识

    这篇文章主要带领大家理解JavaScript表单的基础知识,对javascript表单脚本进行深入学习,感兴趣的小伙伴们可以参考一下
    2016-01-01

最新评论