`

javascript中的全选和反选示例

JavaScriptJava 
阅读更多 
<html>
<head>
<title>全选框／反选框示例</title>
<script type="text/javascript">
  function test()
  {
    var boxs=document.forms[0]['id'];
    for(var i=0;i<boxs.length;i++)
    {
       boxs[i].checked=document.forms[0].allbox.checked?true:false;
    }
  }
</script>
</head>
<body>
 <form>
  <table border="1" cellspacing="0" cellpadding="0" align="center">
    <tr>
	<td><input type="checkbox" name="allbox" onClick="test()"></td>
	</tr>
	<tr>
	  <td><input type="checkbox" name="id" value="1"></td>
	</tr>
    <tr>
	  <td><input type="checkbox" name="id" value="2"></td>
	</tr>
	<tr>
	  <td><input type="checkbox" name="id" value="3"></td>
	</tr>
	<tr>
	  <td><input type="checkbox" name="id" value="4"></td>
	</tr>
	<tr>
	  <td><input type="checkbox" name="id" value="5"></td>
	</tr>
	 <tr>
	  <td><input type="checkbox" name="id" value="6"></td>
	</tr>
	<tr>
	  <td><input type="checkbox" name="id" value="7"></td>
	</tr>
	<tr>
	  <td><input type="checkbox" name="id" value="8"></td>
	</tr>
  </table>
 </form>
</body>
</html>
分享到：
| css中display和visibility的区别
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    复选框的全选和反选、复选框的全选和反选

    本文将深入探讨复选框的全选和反选机制及其在IT中的应用。 全选功能是指用户只需点击一个按钮或复选框，就能同时选中所有相关的复选框。这通常用在数据列表、表格或文件选择场景中。实现这一功能的关键在于正确地...

    js实现全选和反选功能

    在JavaScript中，全选和反选功能通常应用于包含多个复选框（checkbox）的表单中。用户可以通过点击一个主复选框来选择或取消选择所有其他复选框。这个功能在网页表格、数据筛选等场景中非常常见，极大地提高了用户...

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

    在高级控件如DataGridView中，通过结合Checkbox可以实现全选和反选功能，为用户提供便捷的操作方式。这个经典例子将深入探讨如何在Web应用中实现这一功能。 1. **Checkbox基本概念** Checkbox是HTML中的一个表单...

    vue2.0在table中实现全选和反选的示例代码

    Vue 2.0 中 Table 全选和反选的示例代码 在 Vue 2.0 中实现 Table 全选和反选是一种常见的交互方式，本文将介绍如何在 Vue 2.0 中实现 Table 全选和反选的示例代码。 知识点 1: 使用 Vue 的模板语法实现 Table 的...

    简单的JAVASCRIPT全选/反选

    在JavaScript编程中，全选和反选功能是常见的交互操作，尤其在网页表格或列表中。这个主题涉及到了DOM操作、事件处理以及数组方法。下面将详细解释如何使用JavaScript实现全选和反选功能。 首先，我们需要理解...

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

    全选和反选功能在多选列表中尤其常见，例如在批量操作或者多条件筛选时。以下是三种实现Checkbox全选和反选的方法，以及它们的JavaScript和Java实现细节。 ### 方法一：使用`checked`属性 **JavaScript实现**： 在...

    JQ 全选和反选和取消

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

    商业编程-源码-GridView全选反选示例源码.zip

    这个"商业编程-源码-GridView全选反选示例源码.zip"文件很可能是包含了一个实现此功能的示例项目，供开发者参考学习。 在GridView中实现全选和反选通常涉及到以下几个关键知识点： 1. **CheckBoxField**：在...

    js全选/反选

    在这个示例中，`selectAll`函数首先获取页面上所有类型的复选框，然后遍历并设置它们的`checked`属性为`true`，从而实现全选。 二、反选功能 反选功能与全选类似，但它是将所有已选中的项变为未选中状态。同样，...

    JavaScript例子—实现行的增加、删除、全选、反选

    在这个"JavaScript例子—实现行的增加、删除、全选、反选"的示例中，我们聚焦于如何在HTML表格中实现这些常见的用户交互功能。这个例子可能是一个简单的数据管理或表格操作的教程，旨在帮助开发者理解和掌握...

    jQuery全选、反选与获取选中值

    &lt;title&gt;jQuery反选示例 &lt;script src="https://code.jquery.com/jquery-3.6.0.min.js"&gt;&lt;/script&gt; &lt;input type="checkbox" id="invertSelection"&gt; 反选 &lt;input type="checkbox" name="option1"&gt; 选项1 ...

    VS08快捷键,Asp.net JS复选框全选，反选

    同时，在前端开发中，JavaScript的复选框操作是常见的交互功能，全选和反选功能则能提升用户体验。下面将详细介绍这两个方面。 ### VS2008 快捷键 在VS2008中，掌握快捷键能够帮助开发者快速执行常用操作，提高...

    js, jQuery实现全选、反选功能.docx

    在JavaScript和jQuery中，全选和反选功能是常见的交互设计，主要用于用户界面中的复选框操作。在表格、列表或者其他需要多选的场景中，全选和反选功能能够大大提高用户体验。以下将详细介绍如何使用JavaScript和...

    html css js表单中全选取消反选效果

    "全选、取消和反选"功能在多选表单中非常常见，它允许用户方便地选择或取消选择一组选项。本篇文章将深入探讨如何实现这样的功能。 首先，我们需要在HTML中创建一个包含多个可选项目的表单。通常，我们会使用`...

    实现checkbox全选、反选、取消JavaScript小脚本异常

    在前端开发中，checkbox全选、反选、取消的操作是常见的功能需求，通常用于实现批量操作。在此过程中，开发者可能会遇到一些问题，例如页面在执行这些操作时出现异常。这里会详细探讨相关知识点，包括checkbox的基本...

    jQuery实现复选框checkbox全选、反选功能.rar

    本示例中，我们关注的是如何使用jQuery来实现复选框（checkbox）的全选和反选功能，这对于构建具有交互性的表单或者需要用户进行多选操作的界面是非常实用的。 在HTML中，复选框通常由`&lt;input&gt;`标签定义，类型为...

    jquery 、js实现复选框 (全选、反选)

    ### 使用jQuery和JavaScript实现复选框的全选与反选功能 在Web开发中，复选框（checkbox）是常用的一种交互元素，特别是在表格或列表中用于选择多个项目时非常实用。本文将详细介绍如何利用jQuery和原生JavaScript...

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

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

    【JavaScript源代码】JavaScript实现表单全选或反选效果.docx

    在提供的代码示例中，主要涉及两个关键部分： 1. 全选按钮（`j_cbAll`）的点击事件处理： 当用户点击全选按钮时，会触发一个事件监听器。在这个监听器中，代码会遍历所有子复选框（`j_tb`内的`input`元素），并...

Magicbox
Global site tag (gtag.js) - Google Analytics