<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript">
function checkAll() {
var m = document.getElementsByName("all")[0];
var s = document.getElementsByName("check");
if (m.checked) {
for ( var i = 0; i < s.length; i++) {
s[i].checked = true;
}
} else {
for ( var i = 0; i < s.length; i++) {
s[i].checked = false;
}
}
}
function checkEvery() {
var m = document.getElementsByName("all")[0];
var s = document.getElementsByName("check");
for ( var i = 0; i < s.length; i++) {
if (s[i].checked&&m.checked) {
m.checked = true;
} else {
m.checked = false;
}
}
}
function turn() {
with (document) {
var m = getElementById("change");
var n = getElementById("table");
if (m.value == "收缩") {
n.style.display = "none";
m.value = "展开";
} else {
n.style.display = "block";
m.value = "收缩";
}
}
}
</script>
</head>
<body>
<table border="1" align="center" width="60%" id="table1">
<tr>
<td><input type="checkbox" name="all" onclick="checkAll();">全选</td>
<td><input type="button" value="收缩" id="change"
onclick="turn();"></td>
</tr>
</table>
<%
int number = Integer.parseInt(request.getParameter("number"));
%>
<table border="1" align="center" width="60%" id="table">
<%
for (int i = 0; i < number; i++) {
%>
<tr>
<td><input type="checkbox" name="check" onclick="checkEvery()"></td>
<td><%=i%></td>
</tr>
<%
}
%>
</table>
</body>
</html>
分享到：
相关推荐
JavaScript 控制隐藏显示 TABLE 特定列 在 HTML 中，我们经常需要控制 TABLE 的显示和隐藏，特别是在数据表格中，需要根据用户的选择来显示或隐藏某些列。今天，我们将介绍使用 JavaScript 控制隐藏显示 TABLE 特定...
综上所述，"H5中点击checkbox动态显示table"涉及到HTML5的checkbox元素、JavaScript事件处理、DOM操作、数据绑定以及用户体验优化等多个知识点。在实际开发中，这些技术可以组合使用，实现复杂且用户友好的交互功能...
### 隐藏LayUI数据表格表头的Checkbox复选框方法详解 #### 背景介绍 在前端开发过程中，经常会使用到LayUI框架搭建网页应用，尤其是在设计复杂的数据展示界面时，LayUI提供了强大的数据表格功能。然而，在某些场景...
在IT行业中，jQuery是一个广泛使用的JavaScript库，它极大地简化了DOM操作、事件处理、动画制作以及Ajax交互。本文将深入探讨jQuery在实际项目中的应用，特别是针对checkbox和table的处理，这在网页交互和数据展示中...
当需要动态设置checkbox不显示时，可以通过JavaScript中的相关API或者CSS来控制。 在LayUI中，可以使用`layui.use`方法来加载模块，并在回调函数中使用LayUI的相关模块。例如，使用`layFilter`属性来绑定事件，用`...
对于用户界面友好性的提升，vxe-table提供了显示/隐藏列、加载中提示、格式化内容显示以及自定义模板等功能。这些功能使得开发者可以根据需要调整表格的行为，例如，在数据加载过程中显示加载动画，以及为特定单元格...
//仅提供js代码 //这里使用的easyui1.3.6 //解决的问题是Tree控件的checkbox不能设置为不允许用户勾选 //设置一个标志位,在整棵树加载完成后就将标志位设置为false,不允许勾选checkbox了,在加载数据完成之前是...
本案例主要关注如何利用CSS实现简约时尚的样式，并结合HTML中的`checkbox`元素实现全选/取消全选功能以及获取选中项的数量。以下是对这些知识点的详细说明： 一、CSS基础与美化`checkbox` 1. CSS选择器：通过类选择...
// 假设数据ID在隐藏字段中 HiddenField hidId = (HiddenField)row.FindControl("hidId"); selectedIds.Add(Convert.ToInt32(hidId.Value)); } } // 使用Linq to Entities示例 using (var context = new ...
在IT行业中，jQuery是一个广泛使用的JavaScript库，它简化了HTML文档遍历、事件处理、动画以及Ajax交互。本文将深入探讨如何根据JSON文本动态生成可分组的表格，并实现checkbox的partial check功能，这一功能常见于...
6. **列隐藏与显示**：用户可以根据需要显示或隐藏表格的列，使用`columns`配置项来定义列的可见性。 7. **自定义列**：可以定义列的模板，通过`formatter`函数来自定义单元格内容的展示。 8. **扩展功能**：...
2. **CSS隐藏与显示**：使用CSS的`:checked`伪类来选择已勾选的复选框，并通过`display`属性控制关联行或列的可见性。 3. **事件监听**：使用JavaScript监听复选框的`change`事件，当用户点击时更新相关行或列的状态...
在本文中，我们将深入探讨如何使用Jquery dataTable插件来显示指定列，特别是在处理隐藏列的情况下。`Jquery dataTable` 是一个强大且功能丰富的JavaScript库，用于处理HTML表格，提供了排序、过滤、分页等特性，极...
例如，当用户点击“用户管理”时，`show('1')`被调用，它会查找并改变`tr0_1`行的`DISPLAY`属性，从而显示或隐藏与之关联的子菜单。 在CSS中，`DISPLAY: none`用于隐藏元素，而当JavaScript改变这个值为默认值时，...
### 下拉选择项控件(HTML)：...这个控件不仅提供了基本的选择功能，还支持动态显示和隐藏选项列表，以及实时显示用户的选择结果。这种类型的控件非常适合需要用户进行多选操作的场景，在实际项目中具有很高的实用价值。
要使用Bootstrap Table，首先需要在页面中引入相关的库文件，包括Bootstrap的CSS和JS，jQuery库以及Bootstrap Table的JS和CSS。这些文件可以通过CDN链接获取，也可以下载到本地项目中引用。例如： ```html ...
在*** Web表单应用中，Repeater控件常用于以列表形式显示数据，其中的CheckBox控件经常被用于实现某一行的选择功能。在本例中，我们将探讨如何在***使用Repeater控件结合CheckBox来获取选中行中特定控件的值。 首先...
### JSP Table 单元格合并 在网页开发中，表格是展示数据的重要方式之一。为了使表格看起来更简洁明了，在某些情况下我们需要对相同的单元格进行合并处理。本篇文章将详细探讨如何在 JSP（JavaServer Pages）环境中...
本篇文章将深入探讨Repeater控件的使用，包括数据原样导出和动态显示/隐藏Repeater中的列。 **一、Repeater数据原样导出** Repeater控件在ASP.NET中可以方便地绑定数据源，如DataTable，然后通过DataBind()方法将...
9.24 用JavaScript隐藏或显示表格列 9.25 滚动的表格 9.26 交换表的行 9.27 动态拖放表格的宽度 9.28 可输入内容的表格 9.29 可以分级的表格隐藏 9.30 动态创建表格并实现分页 9.31 删除表格指定行 9.32 设置表格的...