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


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 RegExp方法获取地址栏参数(面向对象)
Mar 10 Javascript
jQuery UI AutoComplete 使用说明
Jun 20 Javascript
使用js修改客户端注册表的方法
Aug 09 Javascript
javascript获取选中的文本的方法代码
Oct 30 Javascript
利用javascript实现全部删或清空所选的操作
May 27 Javascript
jQuery版AJAX简易封装代码
Sep 14 Javascript
jQuery插件HighCharts实现的2D回归直线散点效果示例【附demo源码下载】
Mar 09 Javascript
Javascript实现数组中的元素上下移动
Apr 28 Javascript
基于jQuery的表单填充实例
Aug 22 jQuery
详解Vue路由钩子及应用场景(小结)
Nov 07 Javascript
10行原生JS实现文字无缝滚动(超简单)
Jan 02 Javascript
js实现动态时钟
Mar 12 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
PHPShop存在多个安全漏洞
2006/10/09 PHP
转PHP手册及PHP编程标准
2006/12/17 PHP
PHP对字符串的递增运算分析
2010/08/08 PHP
php实现读取内存顺序号
2015/03/29 PHP
php 反斜杠处理函数addslashes()和stripslashes()实例详解
2016/12/25 PHP
ExtJS扩展 垂直tabLayout实现代码
2009/06/21 Javascript
Javascript的一种模块模式
2010/09/08 Javascript
JQUERY dialog的用法详细解析
2013/12/19 Javascript
微信小程序 本地数据读取实例
2017/04/27 Javascript
js实现多张图片延迟加载效果
2017/07/17 Javascript
详解vue-cli项目中的proxyTable跨域问题小结
2018/02/09 Javascript
Vue前后端不同端口的实现方法
2018/09/19 Javascript
jQuery无冲突模式详解
2019/01/17 jQuery
vue实现桌面向网页拖动文件的示例代码(可显示图片/音频/视频)
2021/03/01 Vue.js
Python字符串处理实例详解
2017/05/18 Python
virtualenv实现多个版本Python共存
2017/08/21 Python
关于Python正则表达式 findall函数问题详解
2018/03/22 Python
用python 批量更改图像尺寸到统一大小的方法
2018/03/31 Python
Python使用os.listdir()和os.walk()获取文件路径与文件下所有目录的方法
2019/04/01 Python
python实现飞机大战游戏
2020/10/26 Python
python子线程退出及线程退出控制的代码
2019/10/16 Python
Centos7 下安装最新的python3.8
2019/10/28 Python
Python3 实现减少可调用对象的参数个数
2019/12/20 Python
python中matplotlib实现随鼠标滑动自动标注代码
2020/04/23 Python
python编写实现抽奖器
2020/09/10 Python
在Pycharm中安装Pandas库方法(简单易懂)
2021/02/20 Python
英国排名第一的LED灯泡网站:LED Bulbs
2019/09/03 全球购物
晚会邀请函范文
2014/01/24 职场文书
最新优秀教师个人先进事迹材料
2014/05/06 职场文书
亲子运动会的活动方案
2014/08/17 职场文书
购房委托书
2014/10/15 职场文书
机关干部正风肃纪心得体会
2016/01/15 职场文书
导游词之嵊泗列岛
2019/10/30 职场文书
Nginx解决403 forbidden的完整步骤
2021/04/01 Servers
Qt自定义Plot实现曲线绘制的详细过程
2021/11/02 Python
win10更新失败无限重启解决方法
2022/04/19 数码科技