用js实现收银功能。

 <!DOCTYPE html>

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

 <head>

     <title>xx超市收银系统</title>

     <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">

     </script>

     <script type="text/javascript">

         $(function () {

             $('form').submit(function () {

                 var payable = Number($('#txtPayable').val());//应付

                 var payment = Number($('#txtPayment').val());//实付

                 if (payable === payment) {

                     $('#tdPocket').text(0);

                 } else if (payable > payment) {

                     $('#tdPocket').text('您还需再支付' + (payable*10 - payment*10)/10 + '元！');

                 } else {//需要找零

                     var yuan = [100, 50, 20, 10, 5, 1];

                     var jiao = [5, 2, 1];

                     var msg = '';

                     var payableYuan = parseInt(payable);

                     var paymentYuan = parseInt(payment);

                     var pocketYuan = paymentYuan - payableYuan;//找零元

                     var surplus = pocketYuan;

                     $(yuan).each(function() {

                             if (surplus >= this) {

                                 var count = parseInt(surplus / this);

                                 msg += this + '元' + count + '张';

                                 surplus -= count * this;

                             }

                     });

                     //在js中10.2-10.1=0.09999999999999964，防止小数误差，需要*10

                     var pocketJiao = parseInt(((payment * 10) - (payable * 10)) - (pocketYuan * 10));//找零角

                     surplus = pocketJiao;

                     $(jiao).each(function () {

                         if (surplus >= this) {

                             var count = parseInt(surplus / this);

                             msg += this + '角' + count + '张';

                             surplus -= count * this;

                         }

                     });

                     msg += '共' + pocketYuan + '.' + pocketJiao + '元';

                     $('#tdPocket').text(msg);

                 }

                 return false;

             });

         });

     </script>

     <style type="text/css">

         table {

             border: 1px solid #0000cd;

         }

         td {

             padding: 2px;

         }

         .right {

             text-align: right;

         } 

         .left {

             text-align: left;

             width: 50px;

         }

         .center {

             text-align: center;

         }

     </style>

 </head>

 <body>

     <form>

         <table border="1" cellpadding="0" cellspacing="0">

             <tr>

                 <td class="right">应付：</td>

                 <td class="left"><input type="number" id="txtPayable" min="0" step="any" /></td>

             </tr>

             <tr>

                 <td class="right">实付：</td>

                 <td class="left"><input type="number" id="txtPayment" min="0" step="any" /></td>

             </tr>

             <tr>

                 <td class="right">找零：</td>

                 <td class="left" id="tdPocket"></td>

             </tr>

             <tr>

                 <td colspan="2" class="center"><input type="submit" value="计算" id="btnCalc" /></td>

             </tr>

         </table>

     </form>

 </body>

 </html>

效果

样式有点丑，没时间去调。

找零时，从最大面值的钱开始找，找零5.1，找一张5元，而不是找5张1元。

只考现行的第五套人民币面值，不考虑分币，目前几乎不怎么流通分币了。

重点是算出零钱该找出x张y面值的钱，由于js对于小数计算有误差，需要先将小数换算成整数，再转成小数.

js中10.2-10.1结果是0.09999999999999964;

要想得到结果0.1,笨一点的办法(10.2*10-10.1*10)/10=0.1;

有了这款神器，是不是再也不用担心找错钱了?我还是比较喜欢收银员给我多找点钱:)

如果觉得对你有帮助，请点个赞，谢谢！

不足与错误之处，敬请批评指正！

锋利的js之妈妈再也不用担心我找错钱了的更多相关文章

  1. 妈妈再也不用担心我找不到spring源码了！

    获取spring源码: http://repo.springsource.org/libs-release-local/ http://repo.springsource.org/libs-relea ...

  2. 有了 tldr，妈妈再也不用担心我记不住命令了

    引言 有一次我在培训时说「程序员要善于使用 Terminal 以提高开发效率」,一位程序员反驳道:「这是 21 世纪,我们为什么要用落后的命令行,而不是先进的 GUI?」 是的,在一些人眼里,这个黑黑 ...

  3. 妈妈再也不用担心别人问我是否真正用过redis了

    1. Memcache与Redis的区别 1.1. 存储方式不同 1.2. 数据支持类型 1.3. 使用底层模型不同 2. Redis支持的数据类型 3. Redis的回收策略 4. Redis小命令 ...

  4. 妈妈再也不用担心我使用git了

    妈妈再也不用担心我使用git了 Dec 29, 2014 git git由于其灵活,速度快,离线工作等特点而倍受青睐,下面一步步来总结下git的基本命令和常用操作. 安装msysgit 下载地址:ms ...

  5. 利用CH341A编程器刷新BIOS，恢复BIOS，妈妈再也不用担心BIOS刷坏了

    前几天,修电脑主析就捣鼓刷BIOS,结果刷完黑屏开不了机,立刻意识到完了,BIOS刷错了.就从网上查资料,各种方法试了个遍,什么用处都没有.终于功夫不负有心人,找到了编码器,知道了怎么用.下面看看具体 ...

  6. python爬虫07 | 有了 BeautifulSoup ，妈妈再也不用担心我的正则表达式了

    我们上次做了 你的第一个爬虫,爬取当当网 Top 500 本五星好评书籍 有些朋友觉得 利用正则表达式去提取信息 太特么麻烦了 有没有什么别的方式 更方便过滤我们想要的内容啊 emmmm 你还别说 还 ...

  7. 有了jsRender，妈妈再也不用担心我用jq拼接DOM拼接的一团糟了、页面整齐了、其他伙伴读代码也不那么费劲了

    写在前面 说来也很巧, 下午再做一个页面,再普通不过的分页列表,我还是像往常一样,基于MVC环境下,我正常用PagedList.MVC AJAX做无刷新分页,这时候问题就来了,列表数据中有个轮播图用到 ...

  8. 妈妈再也不用担心我的移动端了：网易和淘宝的rem方案剖析

    从博主学习前端一路过来的经历了解到,前端移动开发是大部分从PC端转战移动端的小伙伴都非常头疼的一个问题,这边博主就根据一篇自己看过的移动开发文章来剖析一下网易和淘宝的rem解决方案,希望能够帮助到一些 ...

  9. 【C#】妈妈再也不用担心自定义控件如何给特殊类型的属性添加默认值了，附自定义GroupBox一枚

    ------------------更新:201411190903------------------ 经过思考和实践,发现套路中的第1条是不必要的,就是完全可以不用定义一个名为Default+属性名 ...

随机推荐

  1. Python 手写数字识别-knn算法应用

    在上一篇博文中,我们对KNN算法思想及流程有了初步的了解,KNN是采用测量不同特征值之间的距离方法进行分类,也就是说对于每个样本数据,需要和训练集中的所有数据进行欧氏距离计算.这里简述KNN算法的特点 ...

  2. C++概念整理

    /* 面向对象: 多态, 继承 封装 */ #include <stdio.h> #include <stdlib.h> //一旦有了纯虚函数,该对象就不能实例化了. #def ...

  3. 数论 UVA 10780

    数论题目.有关内容:整数质因数分解,N的阶乘质因数分解,整除的判断. 这道题的题意是给你两个数n.m,要求你求出n!所能整除的m^k的最大值的k是多少. 由于数据范围:1<m<5000,1 ...

  4. JS判断是否来自手机移动端的访问,并跳转

    var browserName_ = navigator.userAgent ; &&browserName_.indexOf(&&browserName_.index ...

  5. 通过反射得到object[]数组的类型并且的到此类型所有的字段及字段的值

    private string T_Account(object[] list) { StringBuilder code = new StringBuilder(); //得到数据类型 Type t ...

  6. 使用APC缓存PHP opcode

    1.  关于版本 我的php版本是5.3.10  最开始使用 APC-3.1.8  编译成功,但是 php -m 得不到扩展 , 换成 APC-3.1.9  后解决. 2.  关于配置 apc.cac ...

  7. JavaScript 中的window.event代表的是事件的状态,jquery事件对象属性,jquery中如何使用event.target

    http://wenda.haosou.com/q/1373868839069215 http://kylines.iteye.com/blog/1660236 http://www.cnblogs. ...

  8. docker跨容器之使用link大法通信

    容器1 docker run --name elixir -it edib/elixir-phoenix-dev /bin/bash ip address看看自己的ip 容器2 docker run ...

  9. Intellij Idea系列之导Jar包与编写单元测试(二)

     Intellij Idea系列之导Jar包与编写单元测试(二) 一.初衷 对于很多的初学者来说,Intellij如何导入jar包感到很迷惑,甚至在网上搜过相关文章之后还是云里雾里,本博客通过图文并茂 ...

  10. 转，CV和resume的区别

    一直以来,BBS上的信息资料都传达给我一个网上“主流”的关于CV和resume的看法: CV约等于Resume,前者略倾向于学术,后者略倾向于工作经验,字数控制在1-2页内 说实话,一直以来我也就这么 ...