//里面涉及到几张图片，有需要的可以联系我要，直接私信我就行，每天在这个点都会上线，看到就回，或者从我的资料里面找我的联系方式，收到之后会发给你们的
<!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>
<style type="text/css">
.bg{
background-image: url(images/list_bg.gif);
background-repeat: no-repeat;
width: 730px;
}
td{text-align:center;
font-size:13px;
line-height:25px;
}
body{margin:0}
</style>
<script type="text/JavaScript">
function check(){
var oInput=document.getElementsByName("product");
for (var i=0;i<oInput.length;i++)
oInput[i].checked=document.getElementById("all").checked;
}
</script>
</head>
<body><table border="0" cellspacing="0" cellpadding="0" class="bg">
<tr>
<td style="height:40px;"></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr style="font-weight:bold;">
<td><input id="all" type="checkbox" value="全选" onclick="check();" />全选</td>
<td>商品图片</td>
<td>商品名称/出售者/联系方式</td>
<td>价格</td>
</tr>
<tr>
<td colspan="4"><hr style="border:1px #CCCCCC dashed" /></td>
</tr>
<tr>
<td><input name="product" type="checkbox" value="1" /></td>
<td><img src="images/list0.jpg" alt="alt" /></td>
<td>杜比环绕，家庭影院必备，超真实享受<br />
出售者：ling112233<br />
<img src="images/online_pic.gif" alt="alt" />
<img src="images/list_tool_fav1.gif" alt="alt" /> 收藏</td>
<td>一口价<br />
2833.0 </td>
</tr>
<tr>
<td colspan="4"><hr style="border:1px #CCCCCC dashed" /></td>
</tr>
<tr>
<td><input name="product" type="checkbox" value="2" /></td>
<td><img src="images/list1.jpg" alt="alt" /></td>
<td>NVDIA 9999GT 512MB 256bit极品显卡，不容错过<br />
出售者：aipiaopiao110 <br />
<img src="images/online_pic.gif" alt="alt" />
<img src="images/list_tool_fav1.gif" alt="alt" /> 收藏</td>
<td>一口价<br />
6464.0 </td>
</tr>
<tr>
<td colspan="4"><hr style="border:1px #CCCCCC dashed" /></td>
</tr>
<tr>
<td><input name="product" type="checkbox" value="3" /></td>
<td><img src="images/list2.jpg" alt="alt" /></td>
<td>精品热卖：高清晰，30寸等离子电视<br />
出售者：阳光的挣扎 <br />
<img src="images/online_pic.gif" alt="alt" />
<img src="images/list_tool_fav1.gif" alt="alt" /> 收藏</td>
<td>一口价<br />
18888.0 </td>
</tr>
<tr>
<td colspan="4"><hr style="border:1px #CCCCCC dashed" /></td>
</tr>
<tr>
<td><input name="product" type="checkbox" value="4" /></td>
<td><img src="images/list3.jpg" alt="alt" /></td>
<td>Sony索尼家用最新款笔记本 <br />
出售者：疯狂的镜无<br />
<img src="images/online_pic.gif" alt="alt" />
<img src="images/list_tool_fav1.gif" alt="alt" /> 收藏</td>
<td>一口价<br />
5889.0 </td>
</tr>
<tr>
<td colspan="4"><hr style="border:1px #CCCCCC dashed" /></td>
</tr>
</table>
</body>
</html>
分享到：
相关推荐
### JavaScript 实现复选框全选/取消功能 在网页开发中，经常需要用到复选框全选或取消的功能。本文将详细介绍如何通过JavaScript实现这一功能，并解析提供的代码片段。 #### 1. 功能概述 本功能的目标是实现一个...
javascript 复选框全选，复选框全选，复选框全选
本资源"复选框全选、全不选和反选的效果实现.rar"聚焦于JavaScript（JS）实现复选框的全选、全不选和反选功能，这对于创建交互性强、用户体验良好的网页表单至关重要。全选、全不选和反选功能使得用户可以便捷地管理...
在JavaScript编程中，"js控制复选框全选、全不选"是一个常见的需求，尤其在数据表或者选项列表中，用户可能希望一次性选中或取消所有复选框。这个功能可以通过编写简单的JavaScript代码实现。这里我们将深入探讨如何...
总的来说，通过SpreadJS，我们可以轻松地在Web应用中实现与Excel类似的功能，包括列头复选框全选。借助提供的示例代码和库文件，开发者可以快速理解和实现这一特性，提升用户体验。在实际开发中，应结合具体需求对...
### 复选框全选与全不选的概念 复选框（Checkbox）是Web表单中常见的元素，用于收集用户的选择数据。当页面中有多个复选框时，全选（Select All）和全不选（Deselect All）功能可以极大地提高用户体验，让用户能够...
<title>jQuery 复选框全选全不选示例 <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <input type="checkbox" id="selectAll"> 全选 ...
javaScript入门案例之复选框全选，全不选，反选
在网页交互设计中，复选框...综上所述，通过JavaScript实现复选框全选全不选以及子复选框带动全选框的选中功能，主要涉及事件监听、DOM操作和状态同步。这种交互设计能提高用户操作的便捷性，提升网页应用的用户体验。
本教程将深入讲解如何使用JavaScript实现复选框的全选和全不选功能，让您的网页交互体验更加友好。我们将探讨以下几个核心知识点： 1. **DOM操作**：JavaScript通过Document Object Model (DOM)来操作HTML元素。...
在JavaScript中，实现复选框（checkbox）全选或全取消的操作是常见的需求，尤其在数据表或选项列表中。以下是一种实现方法的详细解析： 首先，我们需要理解基本的HTML结构，这里涉及到一个包含多个复选框的表格。在...
### Vue+Vant-UI框架实现购物车复选框全选和反选功能 #### 1. 概述 在电商类应用中，购物车模块是用户进行商品选购时的重要组成部分。其中，复选框全选和反选功能可以帮助用户快速选择或取消选择购物车中的全部商品...
一个实现复选框全选的JavaScript 例子, 如何使用javaScript 使网页上的复选框被选中
以上就是使用jQuery实现复选框全选和反选的基本步骤。在实际项目中，你可能还需要考虑一些边缘情况，例如当子复选框动态添加或删除时，全选状态的更新等。这个小示例提供了一个基础框架，开发者可以根据具体需求进行...
#### 二、原生JavaScript实现复选框全选与反选 除了使用jQuery外，还可以使用原生JavaScript来实现相同的功能。 **2.1 全选功能** ```javascript // 全选 function chooseAll() { var selects = document....
实现这种批量选择的方法往往是使用 JavaScript，通过在每条记录前面加一个复选框，然后在列表下方放置一个“全选/全不选”复选框。 实现批量选择的思路是： 1. 在每条记录前面加一个复选框，该复选框的值为“id|...
本文将详细解析如何使用JavaScript实现复选框的全选与全不选操作。 首先，我们需要创建HTML结构，包含一个用于全选/全不选的主复选框（checkItem）和多个可选的复选框（item）。以下是一个简单的HTML示例： ```...
本示例中，我们关注的是如何使用jQuery来实现复选框（checkbox）的全选和反选功能，这对于构建具有交互性的表单或者需要用户进行多选操作的界面是非常实用的。 在HTML中，复选框通常由`<input>`标签定义，类型为...
在本教程中，我们将深入探讨如何使用JavaScript实现复选框的全选全不选功能。 首先，我们需要在HTML中设置复选框和全选/全不选按钮。例如： ```html <input type="checkbox" name="item" value="1"> Option 1...
本文实例讲述了js与jQuery实现checkbox复选框全选/全不选的方法。分享给大家供大家参考，具体如下： 先来看看JavaScript实现checkbox复选框全选/全不选的方法。这应该是一个比较实用的前端技巧吧，很多时候我们都...