javascript学习实录 之八（计算所选商品总价值

最新推荐文章于 2024-04-28 10:36:10 发布
最新推荐文章于 2024-04-28 10:36:10 发布
阅读量462 收藏 1
点赞数
分类专栏： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/raosheng1993/article/details/45456945
版权


直接上代码，很简单，当你选择商品后，计算商品的总价值

[javascript] view plain copy
  1. <!DOCTYPE html>  
  2. <html>  
  3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
  4. <head>  
  5.     <title></title>  
  6.     <script type="text/javascript">  
  7.         function getSum() {  
  8.             var item = document.getElementsByName("item")  
  9.             var sum = 0;  
  10.             for(var x=0; x < item.length; x++) {  
  11.                 if(item[x].checked) {  
  12.                     sum += parseInt(item[x].value);  
  13.                 }  
  14.             }  
  15.             var spanNode = document.getElementById("sum");  
  16.             str = sum + "元";  
  17.             spanNode.innerHTML = str.fontsize(7);  
  18.         }  
  19.         function checkAll() {  
  20.             var checkA = document.getElementsByName("all")[0];  
  21.             var item = document.getElementsByName("item")  
  22.                 for(var x=0; x < item.length; x++) {  
  23.                    item[x].checked = checkA.checked ;  
  24.                 }  
  25.         }  
  26.     </script>  
  27. </head>  
  28. <body>  
  29.     <input type="checkbox" name="all" οnclick="checkAll()"> 全选 <br/>  
  30.     <input type="checkbox" name="item" value="3000"> 笔记本 : 3000 <br />  
  31.     <input type="checkbox" name="item" value="3000"> 笔记本 : 3000 <br />  
  32.     <input type="checkbox" name="item" value="3000"> 笔记本 : 3000 <br />  
  33.     <input type="checkbox" name="item" value="3000"> 笔记本 : 3000 <br />  
  34.     <input type="checkbox" name="item" value="3000"> 笔记本 : 3000 <br />  
  35.     <input type="checkbox" name="item" value="3000"> 笔记本 : 3000 <br />  
  36.     <input type="checkbox" name="item" value="3000"> 笔记本 : 3000 <br />  
  37.     <input type="checkbox" name="item" value="3000"> 笔记本 : 3000 <br />  
  38.     <input type="checkbox" name="item" value="3000"> 笔记本 : 3000 <br />  
  39.   
  40.     <input type="button" value="获得总金额" οnclick="getSum()"> <span id="sum"></span>  
  41. </body>  
  42. </html> 
ruby小酱
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
js根据应纳税所得额计算税金
liuxf196921的专栏
03-06 1189
//计算工资纳税er function payduty(taxable){ //入参taxable：应纳税所得额 var tax=0; if(taxable&lt;=3000){ tax=taxable*0.03; }else if(taxable &gt; 3000 &amp;&amp; taxable&lt;=12000){ ...
利用javascript技术计算商品总价
10-18
计算商品总价示例代码，仅供参考，谢谢合作!
js 实现 购物篮中常用的计算总价效果
03-30
js 实现 购物篮中常用的计算总价效果! 值得下载看看!资源免费,大家分享!!
html计算选中框的总价格
最新发布
qq_61585709的博客
04-28 87
【代码】html计算选中框的总价格。
购物车数量加减，并统计选中数量和选中总价
08-11
购物车，listview列表，点击+ - 号 增加减少数量，计算单个条目总价，点击checkbox选中，并统计选中数量，统计选中所有商品的总价。
购物车的商品删除，点击全选，价格计算
09-07
购物车的商品删除，点击全选，价格计算，购物车的商品删除，点击全选，价格计算购物车的商品删除，点击全选，价格计算购物车的商品删除，点击全选，价格计算
Javascript 计算字符串在localStorage中所占字节数
10-23
本文给大家分享的是使用Javascript 计算字符串在localStorage中所占字节数，分别对UTF-8和UTF-16两种编码进行了详细说明，有需要的小伙伴可以参考下。
JavaScript学习总结之JS、AJAX应用
10-22
主要介绍了JavaScript学习总结JS AJAX应用 的相关资料,需要的朋友可以参考下
JavaScript完全学习手册
07-22
Javaｓｃｒｉｐｔ完全学习手册内容简介：本书分4篇14章，介绍Javaｓｃｒｉｐｔ的知识，全书内容包括：Javaｓｃｒｉｐｔ语法基础、流程控制、函数、内置对象编程、文档对象模型DOM与事件驱动、处理XML、使用Cookie和...
Javascript入门学习资料收集整理篇
01-21
Javascript入门学习第一篇 js基础Javascript入门学习第二篇 js类型Javascript入门学习第三篇 js运算Javascript入门学习第四篇 js对象和数组Javascript入门学习第五篇 js函数Javascript入门学习第六篇 js DOM编程...
JavaScript入门学习书籍推荐
12-11
在 JavaScript 方面，自己不是什么专家，也不是什么高手，但自己一路走来，JavaScript 从迷茫到认识，对于 JavaScript 书籍的认识或许还有些借鉴价值。 入门推荐首选书籍：《JavaScript DOM 编程艺术 》 ...
jQuery计算选中商品总数和金额
weixin_43743378的博客
07-18 2167
jQuery实现计算选中商品的总数和总金额
html计算商品金额,javascript实现点击商品列表checkbox实时统计金额的方法
weixin_39830313的博客
06-29 546
/p>"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">商品列表统计金额body,div,p{margin:0;padding:0;font-size:14px;}#sumMoney{font-size:26px;font-weight:bold;color:Red;}//全选和全清function checkAll()...
JavaScript计算机和购物总价和
gh323093的博客
11-03 240
计算机： html> html lang="en"> head> meta charset="UTF-8"> title>Titletitle> head> body> input type="number" value="2"> select> option value="1">+option> option value="2">-option> o
js 收税问题
一个开发初学者的博客
03-15 944
对一批货物征收税金（长整型）。价格在1万元及以上的货物征税5%，在5000元及以上，1万元以下的货物征税3%，在1000元及以上，5000元以下的货物征税2%， 1000元以下的货物免税。编写一程序，读入货物价格，计算并输出税金。 <script type="text/javascript"> var huo=parseFloat(prompt("请输入货物价格")) var shui=0; if(huo<1000){ shui=0 document
js实现简单“商品总价计算”
qq_44419617的博客
12-05 7852
实现思路 一、搭建html结构，凡是需要操作数值的地方都用一个小盒子划分开（商品选中数量、单价、小计（已选同类商品价值总和）、商品总数、已选商品价值总和、选中商品中最高单价） 二、给每一个加/减操作button绑定一个onclick事件 1、获取当前button的父节点，用于快速找到其他需要操作的节点 2、点击button同类商品选中数量的加/减操作： 1）获取到存放商品数量的元素 2）获取到button属性flag，根据flag属性值判断进行何种运算 3）运算前保存元素中已有值oldNum，并创建变量存.
JS计算价格根据单价算总价
sugang666的博客
11-01 9459
思路:         1. 当单价改变的时候,计算出这件商品的总金额,同时计算出所有商品的总金额;        2.当单件商品的总金额改变时,计算出所有商品的总金额       3.页面初始化的时候,单价有初始值,自动计算出商品的总金额,同时计算出所有商品的总金额; 注意事项:单价,总金额:input输入框输入的是只能是非负的浮点数或者整数.切只能保留两位小数点   &lt;!DO...
JS计算勾选商品总额
第五个世界的博客
11-28 5830
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html> <head> <title>标签属性练习.html</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> </head> <body> 商品列表<b
购物车实现选中商品算出总价（js）
weixin_44423938的博客
03-26 6600
思想：a:首先可以通过数据库，当你点击一次选择时，对复选框进行扫描，查出所有已经被选中的复选框，这个复选框需要加一个自定义属性，这个属性就是这个商品的id号，通过id号在数据库查询相应的价格进行累加。b:我这里没有用数据库，因为我的上一个需求已经把价格从数据库拿出来了，所以我直接在复选框上加了一个商品价格的自定义属性，当每次点击复选框时对复选框进行扫描，查出所有已经被选中的复选框，然后获取到价格进...
JavaScript学习文档
09-29
JavaScript学习文档，适合0基础的小白，亦或有一定基础的选手，日常学习、复习、参考都是不错的选择；同时也包含了一部分ES5的知识~

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值