html输入两个数实现加减乘除功能

一、parseFloat() 函数 

在网页中制作一个简单的计算器，在文本框输入两个数，能够实现两个数的加减乘除。
parseFloat() 函数可解析一个字符串，并返回一个浮点数。
该函数指定字符串中的首个字符是否是数字。如果是，则对字符
串进行解析，直到到达数字的末端为止，然后以数字返回该数字，
而不是作为字符串。
语法：parseFloat(string)；

二、JavaScript 全局属性  

三、完整代码

!DOCTYPE htML>
    html lang="en">
    head>
        meta charset="UTF-8">
        meta name="viewport" content="width=device-width, initial-scale=1.0">
        meta http-equiv="X-UA-Compatible" content="ie=Edge">
        title>
    Document/title>
        script type="text/javascript">
       function cal(){
               VAR nums = document.getElementsByName("num");
               var sz = document.getElementsByName("js");
               var result = document.getElementsByName("rs");
               var n1 = parseFloat(nums[0].value);
               var n2 = parseFloat(nums[1].value);
           /*parseFloat() 函数可解析一个字符串，并返回一个浮点数。           该函数指定字符串中的首个字符是否是数字。如果是，则对字符           串进行解析，直到到达数字的末端为止，然后以数字返回该数字，           而不是作为字符串。        */            switch(sz[0].value){
                case "add" :             result[0].value = n1 + n2 ;
                break;
                case "min" :             result[0].value = n1 - n2 ;
                break;
                case "mul" :             result[0].value = n1 * n2 ;
                break;
                case "div" :             result[0].value = n1/n2;
                 break;
              }
          }
          /script>
    /head>
    body>
        div align="center">
        input type="text" name="num" value="" onkeyup="value=value.replace(/^\D*(\d*(?:\.\d{
0,2}
    )?).*$/g, '$1')" />
            select name="js" size="1">
                option value="add">
    +/option>
                option value="min">
    -/option>
                option value="mul">
    */option>
                option value="div">
    //option>
            /select>
   input type="text" name="num" value=""onkeyup="value=value.replace(/^\D*(\d*(?:\.\d{
0,2}
    )?).*$/g, '$1')" />
      =   input type="text" name="rs" value=""/>
    br>
       button id="BTn"onclick="cal()">
    计算/button>
    /div>
    /body>
    /html>
    

效果展示:

到此这篇关于html输入两个数实现加减乘除的文章就介绍到这了,更多相关html加减乘除内容请搜索以前的文章或继续浏览下面的相关文章，希望大家以后多多支持！

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！