`
javawangli
  • 浏览: 224872 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

javascript实现全选,反选及全不选

阅读更多

javascript实现全选,反选及全部选

  html 代码:

  

<!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>无标题文档</title>
<script language="javascript">
  
    function select1(oper){
	  var arr= document.getElementsByName("fav");
	  
	   for(var i=0;i<arr.length;i++){
	      switch(oper){
		  case 1:
		   arr[i].checked=oper;
			    break;
		   case 0:
		  arr[i].checked=oper;
			     break;
		   case -1:
		 arr[i].checked=! arr[i].checked;
			       break;
		  
		  
		  }
	   
	   
	   }
	
	
	}



</script>


</head>

<body>


      <input type="checkbox" name="fav"  value="吃饭"/>吃放
    <input type="checkbox" name="fav"  value="吃饭2"/>吃放2
      <input type="checkbox" name="fav"  value="吃饭3"/>吃放3
      <input type="checkbox" name="fav"  value="吃饭4"/>吃放5
      <input type="checkbox" name="fav"  value="吃饭6"/>吃放6
      <input type="checkbox" name="fav"  value="吃饭7"/>吃放7
      <input type="checkbox" name="fav"  value="吃饭8"/>吃放8
		 
		 
     <input type="button" value="全选"  onclick="select1(1)" />
     <input type="button" value="反选"  onclick="select1(-1)" />
     <input type="button" value="取消"  onclick="select1(0)" />
   
</body>
</html>

 

2
4
分享到:
评论
3 楼 tianqin_tq 2011-04-14  
  
2 楼 裴小星 2011-03-16  
原来checked属性的值是0和1。谢谢。
getElementsByName在ie下不会有问题吗?
1 楼 haohao-xuexi02 2011-03-16  
jquery 里面有一个方法,可是实现全选,反选。你可以看看。

相关推荐

    Javascript实现全选反选

    在JavaScript编程中,"全选反选"功能是常见的用户交互设计,常见于表格或列表数据的批量操作中。这个功能允许用户一键选择或取消选择所有项目,极大地提高了操作效率。下面将详细介绍如何使用JavaScript来实现这个...

    jquery全选反选全不选案例

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

    JS实现全选、反选

    JS JS实现全选反选 全选 反选

    简单实现全选反选功能(html)

    在网页开发中,全选和反选功能是常见的交互元素,尤其在表格或者多选项列表中,用户可能希望一键选择所有项目或清除已选。在这个案例中,我们将探讨如何使用HTML和jQuery来实现这一功能。 首先,我们需要创建HTML...

    jquery 实现全选,全不选,反选,获取选中的值

    综上所述,使用 jQuery 实现全选、全不选、反选以及获取选中值的功能是相当直观和简单的。通过绑定事件处理器,我们可以轻松地响应用户的交互,动态地更新页面状态。结合 HTML 结构和适当的 CSS 样式,可以创建出...

    简单js实现全选全部选反选效果

    以上就是使用JavaScript实现全选和反选功能的基本方法。在实际应用中,可能还需要考虑更多细节,如处理异步加载的数据、兼容不同浏览器等。通过不断学习和实践,你可以熟练掌握这些技巧,提高网页的交互性和用户体验...

    jquery全选反选插件

    首先,jQuery全选反选插件的核心功能是实现复选框的批量选择。在网页上,当用户需要对一组选项进行全部选中或全部取消时,这种功能特别实用,例如在数据筛选、表单提交等场景。插件通常通过监听复选框的变化,来控制...

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

    以下是三种实现Checkbox全选和反选的方法,以及它们的JavaScript和Java实现细节。 ### 方法一:使用`checked`属性 **JavaScript实现**: 在JavaScript中,可以通过获取全选按钮的`checked`属性来控制所有复选框的...

    jQuery表格行全选反选单选代码

    jQuery表格行全选反选单选代码,例子采用bootstrap格式,可以选择自定义。

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

    本文将详细讲解如何通过JS和jQuery实现checkbox的全选、反选以及全不选功能。 首先,我们需要理解HTML中的复选框元素`&lt;input type="checkbox"&gt;`,它允许用户在一组选项中进行多选。为了实现全选、反选和全不选的...

    实现table表格checkbox复选框的全选 反选

    在网页开发中,表格(Table)是常用的数据...总的来说,实现HTML表格中复选框的全选与反选功能主要依赖于JavaScript和CSS(用于样式),这是一项基础但重要的交互设计。理解并掌握这个功能,有助于提升网页的用户体验。

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

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

    JS简单表格列表全选反选代码.zip

    本示例中的"JS简单表格列表全选反选代码"是一个使用原生JS编写的功能,它允许用户通过点击表头按钮来实现表格数据的全选和反选操作。这个功能在处理大量数据时特别有用,例如在用户需要批量操作表格项时。 1. **...

    jquery实现全选和反选小功能

    很好用的使用jquery来实现的通用的全选反选功能

    全选反选复选框JS实现

    - `全选反选_按钮.js`这个文件很可能包含了实现这些功能的JS代码。通常,它会包含上述逻辑的函数定义,以及在页面加载完成后绑定事件监听器的代码。 - 例如,可能会有像`selectAll()`、`unselectAll()`和`check...

    多选框全选反选

    本篇文章将详细介绍如何利用JavaScript实现多选框的全选和反选功能。 #### 一、理解需求 根据提供的描述:“多选框全选和反选,用js做的,多选框单选和反选,和使用的代码”,我们可以明确以下几点: 1. **目标**...

    简单的JAVASCRIPT全选/反选

    在上述代码中,`this.checked`代表主复选框的当前状态,将其赋值给每个子复选框,实现了全选/全不选。 反选功能则需要将所有子复选框的选中状态与主复选框的当前状态相反。这可以通过遍历子复选框并切换它们的`...

    jQuery全选反选及批量删除

    "jQuery全选反选及批量删除"是一个常见的交互功能,常用于表格或列表的管理,例如用户可以选择多个项目进行批量操作,如删除。这里我们将深入探讨如何实现这个功能。 首先,我们需要了解jQuery的选择器和事件绑定。...

Global site tag (gtag.js) - Google Analytics