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


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 相关文章推荐
身份证号码前六位所代表的省,市,区, 以及地区编码下载
Apr 12 Javascript
javascript实现yield的方法
Nov 06 Javascript
JS、CSS加载中的小问题探讨
Nov 26 Javascript
js中for in语句的用法讲解
Apr 24 Javascript
Vue数据驱动模拟实现5
Jan 13 Javascript
基于zepto.js实现手机相册功能
Jul 11 Javascript
微信小程序实现文字无限轮播效果
Dec 28 Javascript
实现高性能javascript的注意事项
May 27 Javascript
如何在Vue中抽离接口配置文件
Oct 31 Javascript
深入浅析JavaScript中的in关键字和for-in循环
Apr 20 Javascript
基于PHP pthreads实现多线程代码实例
Jun 24 Javascript
vue项目开启Gzip压缩和性能优化操作
Oct 26 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
Fatal error: session_start(): Failed to initialize storage module: files问题解决方法
2014/05/04 PHP
php修改上传图片尺寸的方法
2015/04/14 PHP
php、java、android、ios通用的3des方法(推荐)
2016/09/09 PHP
PHP的RSA加密解密方法以及开发接口使用
2018/02/11 PHP
php json转换相关知识(小结)
2018/12/21 PHP
PHP实现限制域名访问的实现代码(本地验证)
2020/09/13 PHP
Javascript的IE和Firefox兼容性汇编(zz)
2007/02/02 Javascript
JavaScript 学习笔记(九)call和apply方法
2010/01/11 Javascript
javascript五图轮播切换实用版
2012/08/17 Javascript
js实现快速分享功能(你的文章分享工具)
2013/06/25 Javascript
Javascript玩转继承(三)
2014/05/08 Javascript
Javascript模块化编程详解
2014/12/01 Javascript
jQuery中dequeue()方法用法实例
2014/12/29 Javascript
JavaScript通过join函数连接数组里所有元素的方法
2015/03/20 Javascript
一步步教你利用Canvas对图片进行处理
2017/09/19 Javascript
JS随机排序数组实现方法分析
2017/10/11 Javascript
Vue.js通用应用框架-Nuxt.js的上手教程
2017/12/25 Javascript
vue 之 .sync 修饰符示例详解
2018/04/21 Javascript
新年快乐! javascript实现超级炫酷的3D烟花特效
2019/01/30 Javascript
微信公众号生成新浪短网址的实现(快速生成)
2019/08/18 Javascript
JS实现简易图片自动轮播
2020/10/16 Javascript
[04:27]2014DOTA2国际邀请赛 NAVI战队官方纪录片
2014/07/21 DOTA
python3.5实现socket通讯示例(TCP)
2017/02/07 Python
Python制作豆瓣图片的爬虫
2017/12/28 Python
对python .txt文件读取及数据处理方法总结
2018/04/23 Python
解决Python 爬虫URL中存在中文或特殊符号无法请求的问题
2018/05/11 Python
python 定义类时,实现内部方法的互相调用
2019/12/25 Python
python路径的写法及目录的获取方式
2019/12/26 Python
CSS教程:CSS3圆角属性
2009/04/02 HTML / CSS
店长岗位职责
2013/11/21 职场文书
市政工程技术专业自荐书
2014/07/06 职场文书
2015年七一建党节活动总结
2015/03/20 职场文书
2015政治思想表现评语
2015/03/25 职场文书
工作态度检讨书范文
2015/05/06 职场文书
检讨书怎么写?
2019/06/21 职场文书
GoFrame gredis缓存DoVar Conn连接对象 自动序列化GoFrame gredisDo/DoVar方法Conn连接对象自动序列化/反序列化总结
2022/06/14 Golang