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


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 相关文章推荐
用js实现的检测浏览器和系统的函数
Apr 09 Javascript
JQuery 1.4 中的Ajax问题
Jan 23 Javascript
多引号嵌套的变量命名的问题
May 09 Javascript
javascript简单比较日期大小的方法
Jan 05 Javascript
JavaScript实现iframe自动高度调整和不同主域名跨域
Feb 27 Javascript
JavaScript中实现键值对应的字典与哈希表结构的示例
Jun 12 Javascript
Javascript基础_嵌入图像的简单实现
Jun 14 Javascript
JavaScript中日期函数的相关操作知识
Aug 03 Javascript
浅谈JS封闭函数、闭包、内置对象
Jul 18 Javascript
jQuery除指定区域外点击任何地方隐藏DIV功能
Nov 13 jQuery
解决vue中post方式提交数据后台无法接收的问题
Aug 11 Javascript
JS实现数组深拷贝的方法分析
Mar 06 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导出Excel实例讲解
2016/01/24 PHP
php脚本守护进程原理与实现方法详解
2017/07/20 PHP
PHP设计模式之装饰器模式实例详解
2018/02/07 PHP
js no-repeat写法 背景不重复
2009/03/18 Javascript
javascript分页代码(当前页码居中)
2012/09/20 Javascript
js简单实现根据身份证号码识别性别年龄生日
2013/11/29 Javascript
js下拉选择框与输入框联动实现添加选中值到输入框的方法
2015/08/17 Javascript
JavaScript模板引擎Template.js使用详解
2016/12/15 Javascript
详解Javascript几种跨域方式总结
2017/02/27 Javascript
js实现简单的手风琴效果
2017/02/27 Javascript
整理关于Bootstrap列表组的慕课笔记
2017/03/29 Javascript
Bootstrap按钮组实例详解
2017/07/03 Javascript
微信小程序 配置顶部导航条标题颜色的实现方法
2017/09/20 Javascript
基于BootStrap的文本编辑器组件Summernote
2017/10/27 Javascript
vue.js-div滚动条隐藏但有滚动效果的实现方法
2018/03/03 Javascript
JS实现获取进今年第几天是周几的方法分析
2018/06/27 Javascript
在vue中使用G2图表的示例代码
2019/03/19 Javascript
JS数组属性去重并校验重复数据
2020/01/10 Javascript
vue常用高阶函数及综合实例
2021/02/25 Vue.js
python动态性强类型用法实例
2015/05/09 Python
python中的全局变量用法分析
2015/06/09 Python
Python的SQLalchemy模块连接与操作MySQL的基础示例
2016/07/11 Python
Python使用Tkinter实现机器人走迷宫
2018/01/22 Python
利用python实现汉字转拼音的2种方法
2019/08/12 Python
基于pandas中expand的作用详解
2019/12/17 Python
python中shell执行知识点
2020/05/06 Python
python 决策树算法的实现
2020/10/09 Python
pandas使用函数批量处理数据(map、apply、applymap)
2020/11/27 Python
HTML5本地存储之IndexedDB
2017/06/16 HTML / CSS
大学生联谊活动策划书(光棍节)
2014/10/10 职场文书
2014年社区民政工作总结
2014/12/02 职场文书
外出培训学习心得体会
2016/01/18 职场文书
css3 利用transform-origin 实现圆点分布在大圆上布局及旋转特效
2021/04/29 HTML / CSS
解决vue $http的get和post请求跨域问题
2021/06/07 Vue.js
springBoot基于webSocket实现扫码登录
2021/06/22 Java/Android
python实现简单的三子棋游戏
2022/04/28 Python