`
Franciswmf
  • 浏览: 797311 次
  • 性别: Icon_minigender_1
  • 来自: 上海
文章分类
社区版块
存档分类
最新评论

jquery checkbox 全选 取消 demo

 
阅读更多
第一种:
function checkFunction(){
	if($("#checkAll").is(":checked")){
		$("input[name='checkOne']").attr("checked", true);
	} else {
		$("input[name='checkOne']").attr("checked", false);
	}
}
第二种:
function checkFunction(){
		if($("#checkAll").is(":checked")){
			$("input[name='checkOne']:checkbox").each(function() { 
						$(this).attr("checked", true);
					});
		} else {
			$("input[name='checkOne']:checkbox").each(function() { 
						$(this).attr("checked", false);
					});
		}
}
注意:通常情况下,第一种和第二种在使用的时候没有太大问题,但是如果jsp页面上的html是js生成的,那么反复点击会有问题出现。


第三种:
//全选-取消
function checkFunction(){
	    for (i = 0; i < document.form.checkOne.length; i++) {  
		       if (!document.form.checkOne[i].checked) {  
		            document.form.checkOne[i].checked = true;  
		       }else{
		    	   document.form.checkOne[i].checked = false;  
		       }  
		    }
}
这种原始的js却能奏效!
分享到:
评论

相关推荐

    JQ checkbox 全选和全不选

    "JQ checkbox 全选和全不选"这个主题聚焦于jQuery如何实现复选框的选择功能,特别是全选和全不选的交互效果。这种功能常见于数据表格或列表的筛选中,允许用户一次性选择或取消选择所有项目。 首先,我们需要了解...

    jQuery操作checkbox

    本篇文章将深入探讨如何使用jQuery来操作checkbox元素,包括多选、全选和反选等常见功能。 一、jQuery选择checkbox 在jQuery中,我们可以使用`$('input[type="checkbox"]')`选择所有的checkbox。如果你想根据特定...

    JQ 全选和反选和取消

    标题“JQ全选和反选和取消”涉及的是jQuery中处理多选元素,如复选框或表格行的选择状态。在这个主题下,我们将深入探讨如何实现全选、反选以及取消选择的功能,并结合给出的`demo.html`文件进行实例分析。 1. **...

    JQ 最少代码实现全选和不全选

    标题“JQ最少代码实现全选和不全选”涉及到的是如何使用jQuery来控制多选框(checkboxes)的全选与反选功能。这种功能常见于数据管理界面,用户可以快速选择或取消选择所有项目。下面将详细解释这一知识点。 一、...

    juqery实现复选框全选/反选demo源码

    在标题"jQuery实现复选框全选/反选demo源码"中,我们关注的核心知识点是利用jQuery实现复选框的全选和反选功能。这个功能在许多网页应用中都非常实用,比如在表格数据筛选、表单多选等场景。通过简单的jQuery代码,...

    spreadjs_列头添加复选框全选功能-demo.zip

    4. 反向同步:当用户手动选择或取消选择单元格时,同步更新复选框的状态,以反映当前选择的状态。 总的来说,通过SpreadJS,我们可以轻松地在Web应用中实现与Excel类似的功能,包括列头复选框全选。借助提供的示例...

    一天搞定jQuery(三)——使用jQuery完成复选框的全选和全不选

    在本篇中,我们将深入探讨如何使用jQuery库来实现复选框的全选与全不选功能。jQuery是一个强大的JavaScript库,它简化了DOM操作、事件处理、动画以及Ajax交互等任务,使得开发者能够更高效地编写代码。在这个示例中...

    jQuery操作CheckBox的方法介绍(选中,取消,取值)

    在本文中,我们将深入探讨如何使用jQuery来操作CheckBox(复选框)元素,包括选中、取消选中和获取选中项的值。 首先,我们需要确保页面中已经引入了jQuery库。在示例代码中,通过以下方式引入了jQuery: ```html ...

    selectTree tree控件 日历控件 tree控件 radio CheckBox demo

    HTML同样原生支持`&lt;input type="checkbox"&gt;`,但为了实现更复杂的交互,如分组、多选框的全选/全不选功能,开发者通常会利用jQuery、Bootstrap或其他UI框架提供的扩展。 6. **Ztree**: Ztree是上述控件的核心,它...

    JQ 复选框全选反选

    "JQ 复选框全选反选"是jQuery应用中的一个常见功能,主要用于增强用户界面的交互性。在网页中,复选框常常用于让用户多选选项,而全选和反选功能则提供了方便快捷的选择所有或取消所有选项的方式。 首先,我们需要...

    在easyui-combobox多选模式下加入选择所有选项

    在IT行业中,EasyUI是一个基于jQuery的前端框架,它提供了丰富的UI组件,使得开发者能够快速构建用户界面。本文将深入探讨如何在EasyUI的Combobox组件中实现多选模式,并添加“选择所有”选项的功能。 Combobox是...

    Web开发带checkbox的treeview

    这使得用户可以多选、全选或取消选择特定的节点,非常适合用于权限管理、文件选择等场景。以下是一些关键的配置选项: 1. `checkbox.tie_selection`:默认情况下,选中一个节点会自动选中父节点。如果设置为`false`...

    爱好选择器Demo

    “爱好选择器Demo”是一个基于jQuery的小型应用程序,它允许用户通过选择器来勾选或取消对不同爱好的选择,提供全选、全不选、反选以及提交等操作。这个项目对于学习和理解jQuery的选择器功能是一个很好的实例。 1....

    ztree树节点前面有checkbox

    &lt;TITLE&gt; ZTREE DEMO - checkbox ; charset=UTF-8"&gt; &lt;script type="text/javascript" src="jquery-1.4.4.min.js"&gt; &lt;script type="text/javascript" src="jquery.ztree.core.js"&gt; ...

    使用prop解决一个checkbox选中后再次选中失效的问题

    在全选按钮的点击事件中,我们使用了`$(":checkbox").prop("checked",true)`来设置所有checkbox的checked属性为true,从而实现了全选。在全不选按钮的点击事件中,我们使用了`$(":checkbox").attr("checked",false)`...

    jQuery三态树

    4. **状态同步**:当用户选择或取消选择节点时,需要同步树的当前状态,可能需要更新Json数据,以便在页面刷新或重新加载时恢复用户的操作。 ### 四、tree4_demo.html分析 `tree4_demo.html`文件是实现jQuery三态...

    vue 实现全选全不选的示例代码

    按照jQuery的思想来做的话,要选中全选checkbox和所有的checkbox项,分别注册选中事件,判断选中状态来给相关的checkbox设置对应的状态,这就涉及到很多的dom操作。 下面就看一下vue数据驱动dom的思想来实现这一...

    jquery ztree

    - **多选模式(Checkbox)**:ZTree提供了复选框功能,允许用户选择多个节点,支持全选、反选和单选。 - **异步加载(Async Load)**:根据需要动态加载子节点,提高页面性能,尤其在处理大量数据时。 - **拖拽...

Global site tag (gtag.js) - Google Analytics