<!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 type="text/javascript"> function getSum()
{
var itemNodes = document.getElementsByName("item");
var sum = 0;
for(var i=0; i<itemNodes.length; i++)
{
if(itemNodes[i].checked)
{
sum += parseInt(itemNodes[i].value);
}
} var spanNode = document.getElementById("spanId");
var str = sum + "元";
spanNode.innerHTML = str.fontsize(10);
} function checkAll(checkallNode)
{
var itemNodes = document.getElementsByName("item");
for(var i=0; i<itemNodes.length; i++)
{
itemNodes[i].checked = checkallNode.checked;
}
} </script> </head> <body>
<input type="checkbox" name="all" onclick="checkAll(this)"/>全选<br />
<input type="checkbox" name="item" value="3000" />笔记本电脑:3000元<br />
<input type="checkbox" name="item" value="3000" />笔记本电脑:3000元<br />
<input type="checkbox" name="item" value="3000" />笔记本电脑:3000元<br />
<input type="checkbox" name="item" value="3000" />笔记本电脑:3000元<br />
<input type="checkbox" name="item" value="3000" />笔记本电脑:3000元<br />
<input type="checkbox" name="item" value="3000" />笔记本电脑:3000元<br />
<input type="checkbox" name="item" value="3000" />笔记本电脑:3000元<br />
<input type="button" value="计算金额" onclick="getSum(this)"/> <span id="spanId"></span>
</body>
</html>

JavaScript -- 操作input CheckBox 全选框的更多相关文章

  1. css input checkbox复选框控件 样式美化的多种方案

    checkbox复选框可能是网站中常用的html元素,但大多数人并不满意它的默认样式,这篇文章就讲讲如何实现input checkbox复选框控件 样式美化效果. 资源网站大全 https://55w ...

  2. input checkbox复选框点击获取当前选中状态jquery

    function checkAll(id) { //用is判断 // let checkStatus=$(id).is(':checked'); // console.log(checkStatus) ...

  3. input checkbox 复选框大小修改

    设置zoom属性(放大) 利用style: <input type="checkbox" name="returnfee"  style="zo ...

  4. JavaScript操作checkbox复选框

    运行效果: 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta char ...

  5. 转载:Bootstrap之表格checkbox复选框全选

    转:http://blog.csdn.net/shangmingchao[商明超的博客] 效果图: HTML中无需添加额外的一列来表示复选框,而是由JS完成,所以正常的表格布局就行了: 版权声明:如需 ...

  6. Bootstrap之表格checkbox复选框全选

    效果图: HTML中无需添加额外的一列来表示复选框,而是由JS完成,所以正常的表格布局就行了: <table class="table table-bordered table-hov ...

  7. Bootstrap之表格checkbox复选框全选 [转]

    转自: http://blog.csdn.net/shangmingchao/article/details/49761315 效果图: HTML中无需添加额外的一列来表示复选框,而是由JS完成,所以 ...

  8. JavaScript小例子:复选框全选

    JavaScript小例子:复选框全选 这只是一个小例子,很简单,但是这个功能还是很常用的: 实现后效果如图: JavaScript代码: <script type="text/jav ...

  9. js做全选,用一个checkbox复选框做多个checkbox复选框的全选按钮,有一个复选框未被选择时,全选按钮的checked就为false

    用一个checkbox复选框做多个checkbox复选框的全选按钮,有一个复选框未被选择时,全选按钮的checked就为false,当所有checkbox都被选中时,全选按钮也被选中. 详解: 有两种 ...

随机推荐

  1. 【BZOJ3687】简单题 背包+bitset

    [BZOJ3687]简单题 Description 小呆开始研究集合论了,他提出了关于一个数集四个问题:1.子集的异或和的算术和.2.子集的异或和的异或和.3.子集的算术和的算术和.4.子集的算术和的 ...

  2. Spring基础知识详解

    Spring 概述 1. 什么是spring? Spring 是个java企业级应用的开源开发框架.Spring主要用来开发Java应用,但是有些扩展是针对构建J2EE平台的web应用.Spring ...

  3. 巨蟒python全栈开发django13:中间件部分

    1.回顾昨日内容 2.session认证装饰器 3.django整个流程 4.中间件简单应用 5.简单统计访问次数 6.中间件其他方法 7.orm单表内容回顾

  4. Python3.6全栈开发实例[019]

    19.干掉主播.现有如下主播收益信息, 按照要求, 完成相应操作:(1)计算主播平均收益值 sum = 0 for i in zhubo.values(): sum +=i print(round(s ...

  5. VM和Windows Ping不通

    连接模式:桥接 Linux上1.修改 /etc/sysconfig/network-scripts/ifcfg-enp0s3 文件 ONBOOT=yes2.service network restar ...

  6. mysql数据库补充知识3 查询数据库记录信息之多表查询

    一 介绍 准备表 company.employeecompany.department 复制代码 #建表 create table department( id int, name varchar(2 ...

  7. 01 Spring框架 基本介绍

    相信学习java,并且走Web道路的道友都应该知道Spring的大名,它的地位相信也不需要我在这里多说什么,接下来的文章就Spring的配置和使用来进行一些讲解. 首先学习框架我们都要考虑和做到以下几 ...

  8. loadrunder脚本篇——执行操作系统命令

    思路: 用loadrunner system()函数 函数原型: int system( const char *string ); 示例一:在指定目录下创建指定文件 Action() { char ...

  9. 每天一个Linux命令(57)rpm命令

        rpm是一个功能十分强大的软件包管理系统.     (1)用法:     用法:  rpm  [参数]  [包名]     (2)功能:     功能:  使得在Linux下安装.升级和删除软 ...

  10. Python自然语言处理 - 系列四

    一 如何使用形式化语法来描述无限的句子集合的结构?    --上下位无关文法       1.1 一个例子:      grammar1 = nltk.parse_cfg(""&q ...