<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>无标题文档</title>

<script type="text/javascript">

var result,result1,result2;

function aa1()

    {

        document.getElementById("result1").innerHTML = "";

        var x1 = document.getElementById("num1").value;

        var reg = new RegExp(/^\d*$/);

        if(!reg.test(x1))

        {

            document.getElementById("result1").innerHTML = "数量非法！";

            document.getElementById("num1").focus();

            //document.getElementById("num1").select();

            return;

        }

        var x2 = document.getElementById("price1").value;

        var reg = new RegExp(/^\d*[\.]?\d*$/);

        if(!reg.test(x2))

        {

            document.getElementById("result1").innerHTML = "单价非法！";

            document.getElementById("price1").focus();

            return;

        }

        document.getElementById("result1").innerHTML = x1*x2;

        result1=x1*x2;

    }  

function aa2()

    {

        document.getElementById("result2").innerHTML = "";

        var x1 = document.getElementById("num2").value;

        var reg = new RegExp(/^\d*$/);

        if(!reg.test(x1))

        {

            document.getElementById("result2").innerHTML = "数量非法！";

            document.getElementById("num2").focus();

            //document.getElementById("num2").select();

            return;

        }

        var x2 = document.getElementById("price2").value;

        var reg = new RegExp(/^\d*[\.]?\d*$/);

        if(!reg.test(x2))

        {

            document.getElementById("result2").innerHTML = "单价非法！";

            document.getElementById("price2").focus();

            return;

        }

        document.getElementById("result2").innerHTML = x1*x2;

        result2=x1*x2;

        //document.getElementById("result").innerHTML =result1+result2;

        result=result1+result2;

    document.getElementById("result").innerHTML =result;

    }  

</script>

</head> 

<body>

品名       单价                数量                金额小计<br>

苹果    <input type="text" name="price1" id="price1" onblur="aa1()" />

<input type="text" name="num1" id="num1" onblur="aa1()" />

        

<label id="result1"></label>

<br>

香蕉    <input type="text" name="price2" id="price2" onblur="aa2()" />

<input type="text" name="num2" id="num2" onblur="aa2()" />

        

<label id="result2"></label>

<br>

金额总计<label id="result" ></label>

</body>

</html>

　　

本文出自 “阿凡达” 博客，请务必保留此出处http://shamrock.blog.51cto.com/2079212/819698

JavaScript由单价、数量计算总价的更多相关文章

  1. jQuery实现购物车商品数量及总价的计算

    记录一下项目中遇到的计算购物车商品数量和总价的jQuery代码,重点在于选择器以及.text()命令的使用. 先上效果图,点击加减,商品数量以及总价会发生相应变化. html代码: <div c ...

  2. jquery购物车计算总价

    //计算总价 function cartTotal(){ var total = 0; //循环计算的列,选中计算的数量和价格 //accAdd为精BigDecimal准计算方法 $.each($(& ...

  3. 基于微信小程序的票价和时间选择以及计算总价

    发布时间:2018-10-30   技术:wxml+wxss+JS   概述 微信小程序实现选择时间和票价,根据选择的票价和时间实时计算总价,当时间和票价都显示缺货状态时,点击弹出缺货登记,需要选择票 ...

  4. 一个用于每一天JavaScript示例-使用缓存计算（memoization）为了提高应用程序性能

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  5. JavaScript eval() 函数，计算某个字符串，并执行其中的的 JavaScript 代码。

    JavaScript eval() 函数,计算某个字符串,并执行其中的的 JavaScript 代码. 适合用于计算器的计算,等. 例子: eval("x=10;y=20;document. ...

  6. Hive on Tez 中 Map 任务的数量计算

    Hive on Tez Mapper 数量计算 在Hive 中执行一个query时,我们可以发现Hive 的执行引擎在使用 Tez 与 MR时,两者生成mapper数量差异较大.主要原因在于 Tez ...

  7. DP问题练习2：网格路径数量计算问题

    DP问题练习2:网格路径数量计算问题 问题描述 有一个机器人的位于一个 m × n 个网格左上角. 机器人每一时刻只能向下或者向右移动一步.机器人试图达到网格的右下角. 问有多少条不同的路径? 样例: ...

  8. 【SSH网上商城项目实战28】使用Ajax技术局部更新商品数量和总价

         转自: https://blog.csdn.net/eson_15/article/details/51487323 昨天把项目部署了一下,玩了玩,今天完善了一下购物车中修改商品数量就能局部 ...

  9. JS在页面根据数量改变总价及按钮进行格式验证

    分两部分,第一部分是在页面上,根据数量的input标签内容,动态更新总价标签的内容,代码如下: <script type="text/javascript"> $(do ...

随机推荐

  1. iBatis.Net（C#）SQL数据映射

    转载请注明 http://www.cnblogs.com/13590/archive/2013/03/01/2938126.html 摘要:本文探讨了iBatis.Net框架的XML数据映射文件各配置 ...

  2. [C#] 走进异步编程的世界 - 开始接触 async/await(转)

    原文链接:http://www.cnblogs.com/liqingwen/p/5831951.html 走进异步编程的世界 - 开始接触 async/await 序 这是学习异步编程的入门篇. 涉及 ...

  3. C++创建对象的两种方式

    C++创建对象有两种方式,在栈上创建对象(Objects on the Stack)和在堆上创建对象(Objects on the Heap). 假设我们有以下的类: #include <str ...

  4. 系统级I/O学习记录

    重要知识点 输入/输出(I/O) I/O是主存和外部设备(如磁盘驱动器.终端和网络)之间拷贝数据的过程. 输入操作是从I/O设备拷贝数据到主存. 输出操作是从主存拷贝到I/O设备. Unix I/O ...

  5. Linux基础入门（20135207 王国伊）

    实验一  Linux系统简介 一.实验心得 首个实验是简单介绍了Linux系统的简介,了解Linux系统的历史和发展.使我受益匪浅 实验二  基本概念及操作 一.学习目标 1.实验楼环境介绍 2.常用 ...

  6. Atom使用心得 - 21世纪的编辑器

    Atom使用心得 - 21世纪的编辑器 Atom下载 Atom简介:是专门为程序员推出的一个跨平台文本编辑器.具有简洁和直观的图形用户界面,并有很多有趣的特点:支持CSS,HTML,JavaScrip ...

  7. UIStepper步进器 ——事件驱动型控件,（一个+和-按钮的）

    - (void)viewDidLoad {    [super viewDidLoad];        //步进器 固定的size (94*27), 事件驱动型控件    UIStepper *st ...

  8. Stack around the variable 'szStr' was corrupted.

    错误:stack around the variable “XX” was corrupted.,中文翻译就是“在变量XX周围的堆栈已损坏”. 把 project->配置属性->c/c++ ...

  9. 【MPI0】学习资料搜集

    一个不错的英文的MPI教程:http://mpitutorial.com 中科大的MPI学习资料:http://micro.ustc.edu.cn/Linux/MPI/ 清华大学的并行计算资料:htt ...

  10. C/C++指针内存分配小细节

    char *pc = NULL; pc = new char[0]; pc[0] = '1'; 相信初学者看见上面这段代码,都会觉得奇怪,new char[n]中的n指定给指针变量分配多少内存空间,而 ...