/**
* 全选的所有指定名称的checkbox
*@state 全选的checkbox的状态
*@name 表格中的所有checkbox的名称
*@author fangtf
*@type void
*/
function selectAll(state,name) {
var ids = document.getElementsByName(name);
for (var i = 0; i < ids.length; i++)
{
ids[i].checked = state;
}
}
/**
* 全选的所有指定id名称的同名checkbox
*@state 全选的checkbox的状态
*@name 表格中的所有checkbox的名称
*@name 表格中的所有checkbox的id
*@author fangtf
*@type void
*/
function selectAllCheckboxByID(state,name,id) {
var ids = document.getElementsByName(name);
for (var i = 0; i < ids.length; i++)
{
if(ids[i].id == id)
{
ids[i].checked = state;
}
}
}
/**
* 全选页面上所有的checkbox
*@state 全选的checkbox的状态
*@author fangtf
*@type void
*/
function selectAlls(state)
{
var inputs = document.getElementsByTagName("input");
for(var i =0;i
{
if(inputs[i].type == "checkbox")
{
inputs[i].checked =state;
}
}
}
/**
*得到鼠标所单击的行
*@type Object
*/
function GetRow(oElem) {
while (oElem) {
if (oElem.tagName.toLowerCase() == "tr" && oElem.parentElement.tagName.toLowerCase() == "tbody") {
return oElem;
}
if (oElem.tagName.toLowerCase() == "table" || oElem.tagName.toLowerCase() == "th") {
return false;
}
oElemoElem = oElem.parentElement;
}
}
/**
* 全选当前行的checkbox
*@state 全选的checkbox的状态
*@author fangtf
*@type void
*/
function selectRowCheckbox(state)
{
var row = GetRow(window.event.srcElement);
var cells = row.childNodes;
for(var i=0;i
{
var cell = cells[i].childNodes[0];
if(cell.tagName == "INPUT")
{
cell.checked = state;
}
}
}
/**
*选中指定值的Radio
*如:有两个radio,
*第一个的name="ids",value="1"
*第二个的name="ids",value="2"
*调用方法selectRadio("ids","1");
*那么数值为1的Radio将被选中
*@name radio的名称
*@value radio的值
*@author fangtf
*@type void
*/
function selectRadio(name,value) {
var radioObject = document.getElementsByName(name);
if(value === "")
{
radioObject[0].checked = true;
return;
}
for (var i = 0; i < radioObject.length; i++)
{
if(radioObject[i].value == value)
{
radioObject[i].checked = true;
break;
}
}
}
/**
*选中指定值的checkbox
*如:有两个checkbox,
*第一个的name="ids",value="1"
*第二个的name="ids",value="2"
*第三个的name="ids",value="3"
*调用这个方法selectCheckbox("ids","1,2")那么数值为1,2的checkbox将被选中
*
*@name 要选中的checkbox数组的名称
*@value 判断时候选中的值
*@author fangtf
*@type void
*/
function selectCheckbox(name,value) {
var checkObject = document.getElementsByName(name);
var valuevalues = value.split(",");
for(var j = 0; j < values.length; j++)
{
for (var i = 0; i < checkObject.length; i++)
{
if(checkObject[i].value == values[j])
{
checkObject[i].checked = true;
break;
}
}
}
}
/**
*选中指定值的select
*如:有一个名称为user的select
*
*
*调用这个方法selectOption("user","0")那么选项为0的选项就被选中
*
*@name String select的名称
*@value String 判断时候选中的值
*@author fangtf
*@type void
*/
function selectOption(name,value)
{
var options = document.getElementsByName(name)[0].options;
for (var i = 0; i < options.length; i++)
{
if(options[i].value === value)
{
options[i].selected = true;
break;
}
}
}
分享到:
相关推荐
在本篇内容中,我们将探讨如何使用JavaScript操作ASP.NET中的CheckBox控件,实现特定的功能。 首先,ASP.NET中的CheckBox控件是一种允许用户进行二选一(是/否)选择的UI元素。在提供的代码片段中,DataGrid控件...
### jQuery与JavaScript操作Checkbox全选反选 #### 一、引言 在Web开发中,Checkbox(复选框)是一种非常常见的用户界面元素,用于收集用户的多选输入。尤其是在表单设计时,Checkbox的全选与反选功能极大地方便了...
在C#和JavaScript这两种不同的语言中,对`CheckBox`的操作方法有所不同,但它们在网页交互和后端处理中都扮演着重要角色。 C#主要应用于ASP.NET框架,它是一种服务器端编程语言,用于创建动态网页和Web应用程序。在...
在JavaScript(JS)中,操作HTML元素,包括修改checkbox(复选框)的选中状态,是前端开发中常见的任务。复选框是用户界面中一种允许用户进行多项选择的控件,其状态通常有两种:选中(checked)和未选中。在本文中...
在网页开发中,JavaScript(JS)是一种至关重要的脚本语言,用于实现客户端的交互效果。在HTML表单中,`checkbox`元素常用于提供多选选项。本文将深入探讨如何使用JavaScript来控制checkbox的行为,包括选择、取消...
总的来说,解决IE7中JavaScript操作Checkbox的`checked=true`不打勾的问题,关键在于理解DOM操作的顺序和浏览器的差异性。通过调整代码逻辑,确保元素在DOM中的正确位置再进行属性设置,可以有效地避免此类兼容性...
在JavaScript(JS)中,`checkBox`,也称为复选框,是网页表单中常见的一种元素,用于用户选择一个或多个选项。全选功能在处理多选项时非常实用,比如在一个列表中批量选择所有项目。这个标题和描述虽然重复,但明显...
3. **JavaScript操作Checkbox**: 使用JavaScript,我们可以动态地改变 `checkbox` 的状态。例如,通过 `document.getElementById('option1').checked = true` 可以选中 "Option 1",而 `false` 将取消选中。 4. *...
以上就是使用 jQuery 和 JavaScript 操作 checkbox 全选和反选的基本方法。在实际应用中,你可以根据需要调整这些函数,例如添加事件监听器,使得全选/反选按钮可以触发这些功能。在网页开发中,这样的功能能够显著...
本文将详细讲解如何使用jQuery来操作checkbox,并实现全选、全不选、反选以及获取选中值这四个核心功能。 ### 一、jQuery选择器与checkbox操作 在jQuery中,我们可以使用不同的选择器来选取页面上的checkbox元素。...
"jstree_checkbox"是一个专门用于创建具有复选框功能的权限树结构的JavaScript库。在Web开发中,这样的工具非常实用,特别是在处理用户角色、权限分配或组织结构等需要多级选择和层级关系的场景。它允许用户通过交互...
本篇文章将详细讲解如何进行CheckBoxList的操作,包括获取选中项、实现全选、取消选中以及反选功能,并结合JavaScript进行交互式操作。 首先,我们来了解`CheckBoxList`的基本结构。在ASP.NET中,CheckBoxList控件...
`JS`(JavaScript)作为网页动态交互的主要语言,是实现`TreeView`中`Checkbox`功能的关键。本篇文章将深入探讨如何使用`JS`来实现`TreeView`中`Checkbox`的控制,包括点击父节点时全选子节点,以及点击子节点时保持...
在JavaScript编程中,实现Checkbox的...总的来说,JavaScript实现Checkbox的多级选择是一个涉及到DOM操作、事件处理、可能还有数据结构和算法的综合问题。理解并掌握这一技能,对于开发复杂的前端应用是非常重要的。
在JavaScript中实现树形结构,通常会用到一些库或框架,如jQuery、AngularJS、Vue.js等,但这里提到的"js tree"可能是指一个专门用于构建树形视图的独立库,如jstree(https://www.jstree.com/)。jstree是一个功能...
在JavaScript(JS)中,全选复选框(checkbox)是一项常见的功能,它允许用户一键选择页面上所有的可选项。这个功能广泛应用于数据表格、表单以及任何包含多个选择的界面中,提升用户体验,简化操作流程。在本篇讨论...
本篇文章将深入探讨如何使用jQuery来操作checkbox和radio元素,这两种元素在表单提交和用户交互中扮演着重要角色。 首先,让我们了解checkbox和radio的基本概念。Checkbox用于提供多选选项,用户可以勾选多个选项;...
对于CheckBoxList控件来说,一方面要实现大量数据在服务器端的绑定工作,另一方面往往要求实现全选、反选等功能,接下来将介绍js操作CheckBoxList实现全选/反选,感兴趣的朋友可以了解下,或许对你有所帮助
接着,我们来看如何通过原生JavaScript操作复选框。document.getElementById()方法可以根据元素的ID来获取对应的DOM对象,一旦获取了这个对象,我们可以通过它的checked属性来检查复选框是否被选中。如果复选框被...
而`checkbox.js`文件就是专门针对这种元素进行操作的一个JavaScript库,它提供了全选、全不选以及统计选中个数等功能,极大地提升了用户体验和开发效率。 一、Checkbox.js的核心功能 1. **全选与全不选**:`...