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


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 写类方式之二
Jul 05 Javascript
20款超赞的jQuery插件 Web开发人员必备
Feb 26 Javascript
node.js操作mongodb学习小结
Apr 25 Javascript
react实现菜单权限控制的方法
Dec 11 Javascript
vue实现word,pdf文件的导出功能
Jul 31 Javascript
JavaScript使用prototype原型实现的封装继承多态示例
Aug 31 Javascript
Phaser.js实现简单的跑酷游戏附源码下载
Oct 26 Javascript
超详细动手搭建一个VuePress 站点及开启PWA与自动部署的方法
Jan 27 Javascript
详解JavaScript修改注册表的方法
Jan 05 Javascript
JS 设计模式之:工厂模式定义与实现方法浅析
May 06 Javascript
在Vue中创建可重用的 Transition的方法
Jun 02 Javascript
vue实现图片按比例缩放问题操作
Aug 11 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
PHP配置心得包含MYSQL5乱码解决
2006/11/20 PHP
PHP has encountered an Access Violation at 7C94BD02解决方法
2009/08/24 PHP
php checkbox 取值详细说明
2010/08/19 PHP
php安全开发 添加随机字符串验证,防止伪造跨站请求
2013/02/14 PHP
分享五个PHP7性能优化提升技巧
2015/12/07 PHP
PHP+HTML+JavaScript+Css实现简单爬虫开发
2016/03/28 PHP
Yii控制器中filter过滤器用法分析
2016/07/15 PHP
原生php实现excel文件读写的方法分析
2018/04/25 PHP
PHP实现正则匹配所有括号中的内容
2018/06/22 PHP
Yii框架参数配置文件params用法实例分析
2019/09/11 PHP
javascript中定义私有方法说明(private method)
2014/01/27 Javascript
Node.js中的process.nextTick使用实例
2015/06/25 Javascript
使用jquery+CSS3实现仿windows10开始菜单的下拉导航菜单特效
2015/09/24 Javascript
JavaScript数据操作_浅谈原始值和引用值的操作本质
2016/08/23 Javascript
详解vuelidate 对于vueJs2.0的验证解决方案
2017/03/09 Javascript
JavaScript中document.referrer的用法详解
2017/07/04 Javascript
vue 源码解析之虚拟Dom-render
2019/08/26 Javascript
JS控制GIF图片的停止与显示
2019/10/24 Javascript
vuejs中父子组件之间通信方法实例详解
2020/01/17 Javascript
Python创建二维数组实例(关于list的一个小坑)
2017/11/07 Python
python+numpy+matplotalib实现梯度下降法
2018/08/31 Python
python使用xlrd和xlwt读写Excel文件的实例代码
2018/09/05 Python
Python字符串匹配之6种方法的使用详解
2019/04/08 Python
Python实现的服务器示例小结【单进程、多进程、多线程、非阻塞式】
2019/05/23 Python
Python3.6+Django2.0以上 xadmin站点的配置和使用教程图解
2019/06/04 Python
python tkinter组件摆放方式详解
2019/09/16 Python
python实现名片管理器的示例代码
2019/12/17 Python
Python实现检测文件的MD5值来查找重复文件案例
2020/03/12 Python
python 瀑布线指标编写实例
2020/06/03 Python
利用Python实现Excel的文件间的数据匹配功能
2020/06/16 Python
python 两种方法修改文件的创建时间、修改时间、访问时间
2020/09/26 Python
介绍一下.net和Java的特点和区别
2012/09/26 面试题
专科生就业求职信
2014/06/22 职场文书
学习雷锋精神活动总结
2015/02/06 职场文书
详解JAVA中的OPTIONAL
2021/06/14 Java/Android
Python学习之os包使用教程详解
2022/03/21 Python