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


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中判断函数是new还是()调用的区别说明
Apr 07 Javascript
无限树Jquery插件zTree的常用功能特性总结
Sep 11 Javascript
JavaScript设计模式之原型模式(Object.create与prototype)介绍
Dec 28 Javascript
JavaScript简单生成 N~M 之间随机数的方法
Jan 13 Javascript
js面向对象编程总结
Feb 16 Javascript
Vue.js如何优雅的进行form validation
Apr 07 Javascript
BootStrap模态框和select2合用时input无法获取焦点的解决方法
Sep 01 Javascript
vue实现仿淘宝结账页面实例代码
Nov 08 Javascript
three.js中文文档学习之通过模块导入
Nov 20 Javascript
Vuejs+vue-router打包+Nginx配置的实例
Sep 20 Javascript
vue slot与传参实例代码讲解
Apr 28 Javascript
Vue动态生成表格的行和列
Jul 18 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
火影忍者:这才是千手柱间和扉间的真正死因,角都就比较搞笑了!
2020/03/10 日漫
php下使用strpos需要注意 === 运算符
2010/07/17 PHP
PHP 的ArrayAccess接口 像数组一样来访问你的PHP对象
2010/10/12 PHP
简述php环境搭建与配置
2016/12/05 PHP
PHP rmdir()函数的用法总结
2019/07/02 PHP
PHP FileSystem 文件系统常用api整理总结
2019/07/12 PHP
PHP 实现 WebSocket 协议原理与应用详解
2020/04/22 PHP
js传值 判断
2006/10/26 Javascript
Firefox下提示illegal character并出现乱码的原因
2010/03/25 Javascript
JavaScript 一道字符串分解的题目
2011/08/03 Javascript
js实现简单的星级选择器提交效果适用于评论等
2013/10/18 Javascript
ionic js 模型 $ionicModal 可以遮住用户主界面的内容框
2016/06/06 Javascript
jQuery EasyUI基础教程之EasyUI常用组件(推荐)
2016/07/15 Javascript
基于Bootstrap实现下拉菜单项和表单导航条(两个菜单项,一个下拉菜单和登录表单导航条)
2016/07/22 Javascript
AngularJS  自定义指令详解及实例代码
2016/09/14 Javascript
js中toString()和String()区别详解
2017/03/23 Javascript
mpvue中使用flyjs全局拦截的实现代码
2018/09/13 Javascript
NodeJS模块与ES6模块系统语法及注意点详解
2019/01/04 NodeJs
leaflet加载geojson叠加显示功能代码
2020/02/21 Javascript
使用Vue-cli 中为单独页面设置背景图片铺满全屏
2020/07/17 Javascript
[09:33]2015国际邀请赛第四日TOP10
2015/08/08 DOTA
kNN算法python实现和简单数字识别的方法
2014/11/18 Python
python动态加载包的方法小结
2016/04/18 Python
Python3爬虫学习之将爬取的信息保存到本地的方法详解
2018/12/12 Python
python脚本开机自启的实现方法
2019/06/28 Python
python笔记之mean()函数实现求取均值的功能代码
2019/07/05 Python
python正则表达式匹配不包含某几个字符的字符串方法
2019/07/23 Python
python正则过滤字母、中文、数字及特殊字符方法详解
2020/02/11 Python
150行Python代码实现带界面的数独游戏
2020/04/04 Python
New Balance加拿大官方网站:运动鞋和健身服装
2018/11/19 全球购物
最新奶茶店创业计划书范文
2014/02/08 职场文书
商铺租房协议书范本
2014/12/04 职场文书
幼儿园中班教师个人工作总结
2015/02/06 职场文书
党员年终个人总结
2015/02/14 职场文书
餐饮店长岗位职责
2015/04/14 职场文书
企业安全生产规章制度
2015/08/06 职场文书