购物车选中得到价格实现示例


Posted in Javascript onJanuary 26, 2014
<!DOCTYPE html> 
<html> 
<head> 
<title>MyCart1.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 
<meta http-equiv="description" content="this is my page"> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
<!--<link rel="stylesheet" type="text/css" href="./styles.css">--> 
<script language = "javascript" type = "text/javascript"> 
function jisuan(obj){ 
var total = 0; 
var fruits = document.getElementsByName("fruit"); 
for(var i=0;i<fruits.length;i++){ 
if(fruits[i].checked){ 
total += parseFloat(fruits[i].value); 
} 
} 
myspan.innerText = total + "元"; 
} 
</script> 
</head> 
<body> 
<input type = "checkbox" name = "fruit" value = "10" onclick = "jisuan(this)">苹果 10元<br/> 
<input type = "checkbox" name = "fruit" value = "20" onclick = "jisuan(this)">香蕉 20元<br/> 
<input type = "checkbox" name = "fruit" value = "30" onclick = "jisuan(this)">西瓜 30元<br/> 
<input type = "checkbox" name = "fruit" value = "40" onclick = "jisuan(this)">栗子 40元<br/> 
<input type = "checkbox" name = "fruit" value = "50" onclick = "jisuan(this)">哈密瓜 50元<br/><br/> 
总价格是:<span id = "myspan">0元</span> 
</body> 
</html>

购物车选中得到价格实现示例
Javascript 相关文章推荐
JavaScript 语法集锦 脚本之家基础推荐
Nov 15 Javascript
使用Microsoft Ajax Minifier减小JavaScript文件大小的方法
Apr 01 Javascript
让你的CSS像Jquery一样做筛选的实现方法
Jul 10 Javascript
实用的JS正则表达式(手机号码/IP正则/邮编正则/电话等)
Jan 11 Javascript
jQuery中attr()和prop()在修改checked属性时的区别
Jul 18 Javascript
js实现编辑div节点名称的方法
Dec 17 Javascript
JavaScript Math.ceil 方法(对数值向上取整)
Jan 09 Javascript
AngularJS指令中的绑定策略实例分析
Dec 14 Javascript
详解vue express启动数据服务
Jul 05 Javascript
bootstrap table实现双击可编辑、添加、删除行功能
Sep 27 Javascript
JS和JQuery实现雪花飘落效果
Nov 30 jQuery
在vue中更换字体,本地存储字体非引用在线字体库的方法
Sep 28 Javascript
动态添加option及createElement使用示例
Jan 26 #Javascript
js和jquery使按钮失效为不可用状态的方法
Jan 26 #Javascript
js中创建对象的几种方式示例介绍
Jan 26 #Javascript
Jquery创建层显示标题和内容且随鼠标移动而移动
Jan 26 #Javascript
js加入收藏以及使用Jquery更改透明度
Jan 26 #Javascript
JS对象转换为Jquery对象示例
Jan 26 #Javascript
JavaScript原型链示例分享
Jan 26 #Javascript
You might like
Uchome1.2 1.5 代码学习 common.php
2009/04/24 PHP
关于更改Zend Studio/Eclipse代码风格主题的介绍
2013/06/23 PHP
PHP反向代理类代码
2014/08/15 PHP
PHP使用feof()函数读文件的方法
2014/11/07 PHP
php判断手机浏览还是web浏览,并执行相应的动作简单实例
2016/07/28 PHP
JavaScript 打地鼠游戏代码说明
2010/10/12 Javascript
jquery不会自动回收xmlHttpRequest对象 导致了内存溢出
2012/06/18 Javascript
jQuery 选择器项目实例分析及实现代码
2012/12/28 Javascript
struts2+jquery+json实现异步加载数据(自写)
2013/06/24 Javascript
js取两个数组的交集|差集|并集|补集|去重示例代码
2013/08/07 Javascript
使用typeof方法判断undefined类型
2014/09/09 Javascript
javascript事件模型实例分析
2015/01/30 Javascript
Ajax分页插件Pagination从前台jQuery到后端java总结
2016/07/22 Javascript
jQuery使用getJSON方法获取json数据完整示例
2016/09/13 Javascript
layui之select的option叠加问题的解决方法
2018/03/08 Javascript
使用vue2实现购物车和地址选配功能
2018/03/29 Javascript
React.js绑定this的5种方法(小结)
2018/06/05 Javascript
ajax与jsonp的区别及用法
2018/10/16 Javascript
[04:37]DOTA2英雄梦之声Vol20发条
2014/06/20 DOTA
[02:44]完美大师赛主赛事淘汰赛第二日观众采访
2017/11/24 DOTA
python进程管理工具supervisor使用实例
2014/09/17 Python
Python使用PyCrypto实现AES加密功能示例
2017/05/22 Python
Python随机生成均匀分布在三角形内或者任意多边形内的点
2017/12/14 Python
Python 将pdf转成图片的方法
2018/04/23 Python
Python实现字典按key或者value进行排序操作示例【sorted】
2019/05/03 Python
给大家整理了19个pythonic的编程习惯(小结)
2019/09/25 Python
解决python web项目意外关闭,但占用端口的问题
2019/12/17 Python
小 200 行 Python 代码制作一个换脸程序
2020/05/12 Python
Python fileinput模块如何逐行读取多个文件
2020/10/05 Python
如何一键升级Python所有包
2020/11/05 Python
世界上最好的精品店:Shoptiques
2018/02/05 全球购物
JD Sports丹麦:英国领先的运动时尚零售商
2020/11/24 全球购物
某/etc/fstab文件中的某行如下: /dev/had5 /mnt/dosdata msdos defaults,usrquota 1 2 请解释其含义
2013/09/18 面试题
大专毕业生求职信
2014/07/05 职场文书
2015年父亲节寄语
2015/03/23 职场文书
vue实现拖拽交换位置
2022/04/07 Vue.js