在页面上checkbox使用的比较频繁,一般数据的列表页都会涉及到checkbox的操作,一般的操作有:判读是否选中、判读是否多选等
var checkElement={};
//选中所有
//参数:对应的check组名称
checkElement.selectAllCheck=function(checkName){
var selecters=document.getElementsByName(checkName);
for (i=0; i<selecters.length; i++)
{
if (selecters[i].type == "checkbox")
{
selecters[i].checked=true;
}
}
}
//删除所有选中的勾
//参数:对应的check组名称
checkElement.deleteAllCheck=function(checkName){
var selecters=document.getElementsByName(checkName);
for (i=0; i<selecters.length; i++)
{
if (selecters[i].type == "checkbox")
{
selecters[i].checked=false;
}
}
}
//判断是否有选中的 true or false
//参数:对应的check组名称
checkElement.justifyChecked=function(checkName){
var selecters=document.getElementsByName(checkName);
var flag = false;
for(i=0;i<selecters.length;i++)//先判断是否有选上的项
{
if (selecters[i].type == "checkbox" && selecters[i].checked==true)
{
flag = true;
break;
}
}
return flag;
}
//选择全选或者不选--这个全选框调用的方法,选中它页面的多选框都选中反之亦然
//参数:(全选框对象,tbodyID(table中的<tbody>的id),子checkbox名称也即是tbodyID中的checkbox)
checkElement.selectAllBox=function(checkBox,tbodyId,checkName){
var tbody = document.getElementById(tbodyId);
if(checkBox.checked==true){//当选中时,说明全选
this.selectAllCheck(checkName);
}else{//否则,全不选
this.deleteAllCheck(checkName);
}
}
//由单选框判断全选框状态--tbody中的checkbox调用的方法
//参数:对应的check组名称
checkElement.checkAllStatus=function(checkName){
var selecters=document.getElementsByName(checkName);
var flag = true;
//1.由单选框判断全选框状态
for(i=0;i<selecters.length;i++){
flag &= selecters[i].checked;
}
document.getElementsByName("selectCheck")[0].checked=flag;
return flag;
}
//判断是否有结果集
//参数:对应的check组名称
checkElement.checkHaveResult=function(checkName){
var v = '1';
var check = document.getElementsByName(checkName);
if(check==null || check.length==0){
v=0;
}
if(v=='0'){
alert("没有任何记录");
return false;
}
return true;
}
//判断是否有多选---一般修改时使用
//参数:对应的check组名称
checkElement.justifyCheckedMore=function(checkName){
var count=0;
var selecters=document.getElementsByName(checkName);
var flag = false;
for(i=0;i<selecters.length;i++)//先判断是否有选上的项
{
if (selecters[i].type == "checkbox" && selecters[i].checked==true)
{
count++;
}
}
return count;
}
//获取一个打勾的框的value
//参数:对应的check组名称
checkElement.getCheckedValue=function(checkName){
var v=null;
var selecters=document.getElementsByName(checkName);
var flag = false;
for(i=0;i<selecters.length;i++)//先判断是否有选上的项
{
if (selecters[i].type == "checkbox" && selecters[i].checked==true)
{
v = selecters[i].value;
}
}
return v;
}
//在checkName对应的check组中获取要修改的ID
//参数:对应的check组名称
checkElement.getModifyId=function(checkName){
var modifyId='';
var count =this.justifyCheckedMore(checkName);
if(count==0){
alert("请选择需要修改的记录信息!",msg_Type);
}else if(count>1){
alert("请选择一行记录进行修改!",msg_Type);
}else{
modifyId= this.getCheckedValue(checkName);
}
return modifyId;
}
//在checkName对应的check组中判断是否可以删除
//参数:对应的check组名称
checkElement.getDeleteFlag=function(checkName){
var deleteFlag='0';
var count =this.justifyCheckedMore(checkName);
if(count==0){
alert("请选择需要删除的记录信息!",msg_Type);
}else{
deleteFlag="1";
}
return deleteFlag;
}
//点击一行时行高亮
checkElement.trClick=function(obj){
//如果点击的是checkbox本身,则跳过点击行事件,以免事件重复执行,导致选不上的现象
if(event.srcElement.type=="checkbox"){
return;
}
var checkbox=$(obj).find("input:checkbox")[0];
if(checkbox.checked==true){
checkbox.checked=false;
}else{
checkbox.checked=true;
}
this.checkAllStatus(checkbox.name);
}
分享到:
相关推荐
在ASP.NET Web Forms开发中,CheckBoxList控件是一种常用的选择组件,它允许用户从一系列选项中选择一个或多个项目。本篇文章将详细讲解如何进行CheckBoxList的操作,包括获取选中项、实现全选、取消选中以及反选...
例如,`$("input[type=checkbox]")`会选择页面上所有的checkbox。如果要选取特定ID或类名的checkbox,可以使用`$("#checkboxID")`或`$(".checkboxClass")`。 二、选中与取消选中checkbox 1. 选中checkbox: ```...
### 一、jQuery选择器与checkbox操作 在jQuery中,我们可以使用不同的选择器来选取页面上的checkbox元素。例如,使用`$('input[type="checkbox"]')`可以选取所有类型的checkbox。如果想要选取特定ID的checkbox,...
JavaScript(简称JS)是一种轻量级的解释型编程语言,广泛应用于网页和互联网应用开发,包括操作DOM元素、处理用户交互、实现动态效果等。在本篇内容中,我们将探讨如何使用JavaScript操作ASP.NET中的CheckBox控件,...
"自定义checkbox与button操作"这个主题涉及到如何通过编程实现一种特定的用户交互模式,即根据checkbox的状态来控制button的功能和视觉表现。这通常是通过JavaScript、CSS以及HTML来实现的。 首先,我们需要了解...
根据提供的信息,我们可以总结出以下知识点: ### C#中处理Checkbox的选择值 #### 知识点一:理解Checkbox的功能及用途 ...以上知识点涵盖了从基本的Checkbox操作到高级处理技巧,希望对理解和应用这些技术有所帮助。
而这里的jQuery代码可能用于构建一个动态的、交互性强的菜单系统,使得用户可以通过选择和移动选项来导航到不同的页面或执行特定操作。 【压缩包子文件的文件名称列表】: 1. "说明.htm" - 这个文件通常会提供关于...
1. **选择元素**:jQuery提供了多种选择器,如`$("[type=checkbox]")`和`$("[type=radio]")`,可以用来选取页面上所有的checkbox或radio元素。如果你想选择具有特定ID或类名的元素,可以使用`$("#checkboxID")`或`$...
项目中的分页使用真分页,每次...把选中的checkbox中的id,其中包括模块id,操作id,拼接成一个字符串,然后把字符串传递到action中。 每次调用此页面时,首选调用action中的选中的id字符串,然后根据在id字符串的基
在很多场景下,我们还需要在树形结构中的每个节点上添加`Checkbox`,以便用户能够方便地进行单个或批量的选择操作。然而,在实现这种功能时会遇到一个典型的问题:当选择了某个子节点后,其父节点也应自动被选中;...
在C#中操作`CheckBox`,首先需要在HTML或者ASP.NET的页面上定义一个`CheckBox`控件,例如: ```html <asp:CheckBox ID="myCheckBox" runat="server" Text="同意服务条款" /> ``` 然后,在C#代码-behind文件中,...
在实际应用中,Checkbox Tree常用于配置页面,例如在权限管理、目录结构选择、软件功能模块开关等场景。开发者可以利用各种前端框架或库(如React、Vue、Angular等)实现Checkbox Tree,例如在JavaScript中,有一些...
在`Default3.aspx`页面上,可能会有多个CheckBox控件,每个代表不同的选项。同样,`Default3.aspx.cs`文件会包含处理这些控件的C#代码。 处理CheckBox的基本步骤包括: 1. **创建和初始化**: 声明控件,设置ID,...
这段代码会在id为`checkboxContainer`的元素中,为每个选项创建一个checkbox,并将其值和文本添加到页面上。 **设置一行最多显示几个checkbox** 要限制每行显示的checkbox数量,可以使用CSS来布局,或者使用...
- 使用`document.getElementsByTagName('input')`获取页面上所有的`<input>`元素。 - 遍历这些元素,根据它们的`type`属性和`name`属性判断是否需要修改选中状态。 - 在处理子项CheckBox时,还需要额外判断父项...
在网页设计和开发中,`checkbox`元素是一个重要的交互组件,它允许用户对一组选项进行选择或取消选择。本文将详细讲解如何实现`checkbox`的全选功能,这对于初学者理解`checkbox`的应用及其在页面布局中的使用至关...
在JavaScript(JS)中,`checkBox`,也称为复选框,是网页表单中常见的一种元素,用于用户选择一个或多个选项。全选功能在处理多选项时非常实用,比如在一个列表中批量选择所有项目。这个标题和描述虽然重复,但明显...
WebApplication1可能是ASP.NET的一个项目,它包含一个或多个网页,其中一个页面可能有包含Checkbox和DataGridView的界面。在ASP.NET中,Checkbox控件通常用`<asp:CheckBox>`标记表示,而DataGridView则是用来显示...
在网页上实现多选功能,通常需要一组 `checkbox`,通过设置 `name` 属性相同,让它们成为一组,允许用户同时选择多个。例如: ```html <input type="checkbox" id="option1" name="options" value="1"> ...
4. **DOM操作**:在计算出选区后,我们需要遍历页面上的所有checkbox,并检查它们是否位于矩形内。这涉及到获取每个checkbox的位置信息(如`offset()`或`getBoundingClientRect()`),以及比较这些坐标是否在选区...