js表单计算金额问题
<
table
width
=
"600"
border
=
"1"
align
=
"center"
style
=
"text-align:center;"
>
<
tr
>
<
td
width
=
"102"
><
input
type
=
"checkbox"
id
=
"all"
/>全选</
td
>
<
td
width
=
"203"
>商品</
td
>
<
td
width
=
"119"
>单价</
td
>
<
td
width
=
"148"
>数量</
td
>
</
tr
>
<
tr
>
<
td
><
input
type
=
"checkbox"
id
=
"qianbi"
/></
td
>
<
td
>铅笔</
td
>
<
td
>1.5元/支</
td
>
<
td
><
input
type
=
"text"
id
=
"qianbi_t"
value
=
"1"
/></
td
>
</
tr
>
<
tr
>
<
td
><
input
type
=
"checkbox"
id
=
"yuanzhu"
value
=
""
/></
td
>
<
td
>圆珠笔</
td
>
<
td
>2.5元/支</
td
>
<
td
><
input
type
=
"text"
id
=
"yuanzhu_t"
value
=
"1"
/></
td
>
</
tr
>
<
tr
>
<
td
><
input
type
=
"checkbox"
id
=
"gangbi"
value
=
""
/></
td
>
<
td
>钢笔</
td
>
<
td
>3元/支</
td
>
<
td
><
input
type
=
"text"
id
=
"gangbi_t"
value
=
"1"
/></
td
>
</
tr
>
<
tr
>
<
td
colspan
=
"4"
>金额合计:<
span
id
=
"m"
style
=
"color:#F00;"
></
span
>元 <
button
>提交订单</
button
></
td
>
</
tr
>
</
table
>
<
script
type
=
"text/javascript"
>
var all=document.getElementById("all");
var qianbi=document.getElementById("qianbi");
var yuanzhubi=document.getElementById("yuanzhu");
var gangbi=document.getElementById("gangbi");
var qb_m=0,yzb_m=0,gb_m=0;
all.onclick=function(){
if(all.checked){
qianbi.checked=true;
yuanzhubi.checked=true;
gangbi.checked=true;
}
else{
qianbi.checked=false;
yuanzhubi.checked=false;
gangbi.checked=false;
}
sub();
};
qianbi.onclick=function(){sub()};
yuanzhubi.onclick=function(){sub()};
gangbi.onclick=function(){sub()};
document.getElementById("qianbi_t").addEventListener("change",function(e){
sub();
});
document.getElementById("yuanzhu_t").addEventListener("change",function(e){
sub();
});
document.getElementById("gangbi_t").addEventListener("change",function(e){
sub();
});
function sub(){
if(qianbi.checked){
qb_m=document.getElementById("qianbi_t").value*1.5
}
else{
qb_m=0;
all.checked=false;
}
if(yuanzhubi.checked){
yzb_m=document.getElementById("yuanzhu_t").value*2.5
}
else{
yzb_m=0;
all.checked=false;
}
if(gangbi.checked){
gb_m=document.getElementById("gangbi_t").value*3
}
else{
gb_m=0;
all.checked=false;
}
var sum=qb_m+yzb_m+gb_m;
document.getElementById("m").innerHTML=sum;
}
</
script
>
js表单计算金额问题的更多相关文章
- js表单验证工具包
常用的js表单验证方法大全 /* 非空校验 : isNull() 是否是数字: isNumber(field) trim函数: trim() lTrim() rTrim() 校验字符串是否为空: ch ...
- JS表单验证-12个常用的JS表单验证
JS表单验证-12个常用的JS表单验证 最近有个项目用到了表单验证,小编在项目完结后的这段时间把常用的JS表单验证demo整理了一下,和大家一起分享~~~ 1. 长度限制 <p>1. 长度 ...
- js 表单验证控制代码大全
js表单验证控制代码大全 关键字:js验证表单大全,用JS控制表单提交 ,javascript提交表单:目录:1:js 字符串长度限制.判断字符长度 .js限制输入.限制不能输入.textarea 长 ...
- node.js表单——formidable/////z
node.js表单--formidable node处理表单请求,需要用到formidable包.安装formidable包的命令如下: npm install formidable 安装pack ...
- js表单提交,面向对象
一.js表单验证之后再提交 1.普通按钮onclick函数调用表单的submit()函数 <input type=button name="submit1" value=&q ...
- jquery.validation.js 表单验证
jquery.validation.js 表单验证 官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation jQuer ...
- Jquery.validate.js表单验证插件的使用
作为一个网站web开发人员,以前居然不知道还有表单验证这样好呀的插件,还在一行行写表单验证,真是后悔没能早点知道他们的存在. 最近公司不忙,自己学习一些东西的时候,发现了validation的一个实例 ...
- angular js 表单验证
<!doctype html> <html ng-app="myapp"> <head> <meta charset="UTF- ...
- JS表单验证类HTML代码实例
以前用的比较多的一个JS表单验证类,对于个人来说已经够用了,有兴趣的可以在此基础上扩展成ajax版本.本表单验证类囊括了密码验证.英文4~10个 字符验证. 中文非空验证.大于10小于100的数字.浮 ...
随机推荐
- eclipse新建tomcat server但是总是报404的解决方法
今天在eclipse中新建了tomcat server,但是由于一些配置出了问题,导致总是出现404报错,具体情况如下 症状: tomcat在eclipse里面能正常启动,而在浏览器中访问http:/ ...
- 转载: 8个月从CS菜鸟到拿到Google Offer的经历+内推
8个月从CS菜鸟到拿到Google Offer的经历+内推 http://blog.csdn.net/fightforyourdream/article/details/17094127 http:/ ...
- java timer timertask mark
其实就Timer来讲就是一个调度器,而TimerTask呢只是一个实现了run方法的一个类,而具体的TimerTask需要由你自己来实现,例如这样: 1 2 3 4 5 6 Timer timer = ...
- 关联容器——map、set
map类型通常被称为关联数组,与正常数组类似,不同之处在于其下标不必是整数.我们通过一个关键字而不是位置来查找值(键值对). 与之相对,set就是关键字的简单集合.当只是想知道一个值是否存在时,set ...
- vim添加复制(crtl+c),粘贴(ctrl+v)ctrl+A 等快捷键
1 在 /usr/share/vim/vimrc文件中添加 source $VIMRUNTIME/mswin.vim 2 mswin.vim位置在 /usr/share/vim/vim72/ ...
- RSA算法工具
RSA算法工具-生成密钥对(生成密钥对) RSA算法工具-解析密钥对(导入密钥对,解析密钥对) RSA测试工具-计算分量(输入P,Q,E,计算出N,DP,DQ,Qinv)
- 查看局域网其它电脑的计算机名和IP
一.下面脚本可查看局域网中的电脑计算机名和IP,保存下面文本至记事本.后缀改成bat COLOR 0A CLS @ECHO Off Title 查询局域网内在线电脑IP :send @ECHO off ...
- SparkSQL ThriftServer服务的使用和程序中JDBC的连接
SparkSQL ThriftServer服务的使用和程序中JDBC的连接 此时要注意版本问题,我第一次用的是hive2.1.1的,因为要用sparksql的hive服务,但是sparksql默认的是 ...
- echart 地图
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"% ...
- socket数据收发
socket读写 TCP协议是面向流的,read和write调用的返回值往往小于参数指定的字节数.对于read调用,如果接收缓冲区中有20字节,请求读100个字节,就会返回20.对于write调用,如 ...