`
JavaCrazyer
  • 浏览: 3012114 次
  • 性别: Icon_minigender_1
  • 来自: 河南
社区版块
存档分类

JS中关于checkbox全选或全不选

阅读更多

对于下面这样的全选或者选不选的情况,大家日常会经常看到,总结在此,以便今后使用


具体代码

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>CheckBox用法</title>
<script language="javascript">
function ss(checks)
{
var qx=document.getElementsByName("checkbox");
for(var i=0;i<qx.length;i++)
{
qx[i].checked=checks;
}

}
function aa(checked)
{
var qx=document.getElementsByName("checkbox");
for(var i=0;i<qx.length;i++)
{
if(qx[i].type="checkbox")
{
qx[i].checked=checked;
}
}
}
</script>
</head>

<body>
<form>
<input name="checkbox" type="checkbox" id="s1" />选择一<br/>
<input name="checkbox" type="checkbox" id="s2" />选择二<br/>
<input name="checkbox" type="checkbox" id="s3" />选择三<br/>
</form>
<a href="javascript:ss(true)">全选</a><br/>
<a href="javascript:ss(false)">全不选</a><br/>
<input name="checkbox1" type="checkbox" id="s4" onclick="aa(this.checked)" />全选<br/>
</body>
</html>

 
 

  • 大小: 1.7 KB
2
1
分享到:
评论
6 楼 jacking124 2011-07-08  
恩,其实javascript和jquery都有优势的。基础是javascript,但是使用中我还是喜欢用jquery写,因为简单。
5 楼 libmw 2010-11-30  
JavaCrazyer 写道
$("input:checkbox[name='checkbox的name值']").attr("checked",true)
zhanghongliang_cyj 写道
大哥,用不了那么麻烦吧!

$("input:checkbox[name='checkbox的name值']").attr("checked",true)  //全选

$("input:checkbox[name='checkbox的name值']").attr("checked",false)  //全不选

这种应该是JQUERY的方式吧

会不会现在很多人都把jquery和js搞混淆了?
4 楼 JavaCrazyer 2010-11-26  
$("input:checkbox[name='checkbox的name值']").attr("checked",true)
zhanghongliang_cyj 写道
大哥,用不了那么麻烦吧!

$("input:checkbox[name='checkbox的name值']").attr("checked",true)  //全选

$("input:checkbox[name='checkbox的name值']").attr("checked",false)  //全不选

这种应该是JQUERY的方式吧
3 楼 zhanghongliang_cyj 2010-11-26  
大哥,用不了那么麻烦吧!

$("input:checkbox[name='checkbox的name值']").attr("checked",true)  //全选

$("input:checkbox[name='checkbox的name值']").attr("checked",false)  //全不选
2 楼 JavaCrazyer 2010-11-26  
satikey 写道
这个好办,不过哥不会纯生的JavaScript代码,会Jquery。在此佩服了、

只要能实现效果,JavaScript和JQuery都可以啦,呵呵
1 楼 satikey 2010-11-26  
这个好办,不过哥不会纯生的JavaScript代码,会Jquery。在此佩服了、

相关推荐

    JS实现CheckBox复选框全选、不选或全不选功能

    CheckBox复选框JS实现全选、不选、全不选功能,很简单,具体内容如下 思路: 1、获取元素 2、给全选 不选 反选添加点击事件 3、用for循环checkbox 4、把checkbox的checked设置为true即实现全选 5、把checkbox的...

    JQ checkbox 全选和全不选

    在实际开发中,可能还需要考虑其他因素,比如防止在复选框数量巨大时导致性能问题,或者在异步加载数据时确保全选/全不选状态的一致性。此外,对于无障碍性( Accessibility )的考虑,确保键盘用户也能方便地使用...

    SimpleTree扩展:支持checkbox节点选择(半选、全选、不选)

    在这个特定的主题中,我们关注的是SimpleTree的一个扩展,即对checkbox节点的支持,这允许用户进行半选、全选或不选的操作。 在Web开发中,树形结构常用于展现层次化的信息,如文件系统、组织架构或者菜单导航。...

    jquery Checkbox 全选 反选 全不选 多种实现方法

    在涉及到表单元素如复选框(Checkbox)时,经常需要实现全选、反选和全不选的功能。下面将详细探讨 jQuery 如何实现这些功能,以及如何进行表单验证。 1. **全选功能** 要实现全选功能,首先我们需要一个主复选框...

    Js/Jquery 实现checkbox全选,反选,全不选

    在提供的文件“js实现checkbox全选,反选,全不选.htm”中,应当包含了上述功能的具体实现。通过查看源码,我们可以了解到实际的HTML结构以及jQuery脚本是如何与之配合的。这个文件可以作为一个示例,帮助我们更好地...

    checkbox实现全选和反选经典例子

    综上所述,"checkbox实现全选和反选经典例子"是一个关于如何在Web应用中利用Checkbox控件提高用户交互性的实践教程。通过理解Checkbox的基本操作,结合服务器控件的事件处理和逻辑编程,我们可以创建出高效且易于...

    CheckBox全选并删除

    以上就是关于"CheckBox全选并删除"这个主题的相关知识点,涵盖了CheckBox全选的实现方式、删除操作的步骤、相关的ASP.NET控件属性和事件,以及在实际开发中需要注意的安全性、用户体验、性能优化等问题。

    js控制复选框全选、全不选

    在JavaScript编程中,"js控制复选框全选、全不选"是一个常见的需求,尤其在数据表或者选项列表中,用户可能希望一次性选中或取消所有复选框。这个功能可以通过编写简单的JavaScript代码实现。这里我们将深入探讨如何...

    checkBox全选——jscheckBox全选——jscheckBox全选——js

    在JavaScript(JS)中,`checkBox`,也称为复选框,是网页表单中常见的一种元素,用于用户选择一个或多个选项。全选功能在处理多选项时非常实用,比如在一个列表中批量选择所有项目。这个标题和描述虽然重复,但明显...

    checkbox的全选与取消

    在网页设计中,复选框(Checkbox)是用户界面中不可或缺的一部分,它允许用户对多个选项进行选择。本文将深入探讨“复选框的全选与取消”这一主题,主要基于提供的HTML文件“checkbox.html”。全选和取消功能通常...

    三种方式实现checkbox全选,反选

    在网页开发中,Checkbox(复选框)是用户界面中常用的一种元素,它允许用户从多个选项中选择一个或多个。全选和反选功能在多选列表中尤其常见,例如在批量操作或者多条件筛选时。以下是三种实现Checkbox全选和反选的...

    easyui checkbox +全选

    标题 "easyui checkbox +全选" 指的是在网页界面设计中使用 EasyUI 框架实现复选框(checkbox)以及全选功能。EasyUI 是一个基于 jQuery 的前端框架,它提供了一系列预定义的 CSS 样式和 JavaScript 组件,帮助...

    简约时尚CSS样式,checkbox 全选或取消全选、或得到选中个数全案例使用详解

    "Table简约时尚CSS样式,checkbox全选或取消全选、或得到选中个数全案例使用详解(百度、CSDN、ITEye).html"是一个实际的示例文件,它包含完整的HTML和CSS代码,可能还包含了JavaScript实现。这个案例演示了如何将...

    checkbox全选,选中数据传到后台

    在IT行业中,尤其是在Web开发领域,"checkbox全选,选中数据传到后台"是一个常见的功能需求。这个功能主要用于用户批量处理数据,如删除、修改等。以下是对这个主题的详细解析: 首先,我们需要理解标题中的关键词...

    checkbox全选,反选,选特定的值

    js原生,checkbox全选,反选,选特定的值。jq会更简单。。初学时候比用的

    js checkbox全选 反选 取消全部设置表单html复选框

    "js checkbox全选 反选 取消全部设置表单html复选框"这个标题描述了一个常见的功能需求,即通过JavaScript控制HTML中的复选框(checkboxes),实现全选、反选和取消全部选中的功能。在本文中,我们将深入探讨如何...

    javascript实现全选全不选

    在JavaScript编程中,“全选”和“全不选”功能是常见的用户交互设计,尤其在数据列表或表格中,用户通常需要快速选择或取消选择所有项目。这些功能可以通过简单的JavaScript代码实现,通常与HTML的复选框(checkbox...

    jquery全选反选全不选案例

    "jquery全选反选全不选案例" 是一个常见的交互功能,常见于表格或者列表中,允许用户一键选择或取消所有选项。这个功能在数据筛选、批量操作等场景下非常实用。 实现这一功能的关键在于理解 jQuery 中的选择器和...

    复选框全选全不选JS代码

    本文将深入探讨“复选框全选全不选JS代码”的实现原理、应用场景以及如何优化这段代码,以便开发者能够更好地理解和运用到实际项目中。 ### 复选框全选与全不选的概念 复选框(Checkbox)是Web表单中常见的元素,...

    用js代码写全选与全不选

    在JavaScript(JS)中,全选与全不选的功能通常应用于多选列表或者表格中,让用户可以方便地一次性选择或取消所有选项。这个主题对于初学者来说是非常基础且实用的知识点,下面我们将深入探讨如何使用JavaScript实现...

Global site tag (gtag.js) - Google Analytics