欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

html輸入兩個(gè)數(shù)實(shí)現(xiàn)加減乘除功能

  發(fā)布時(shí)間:2021-08-07 16:59:48   作者:Jian Yue   我要評(píng)論
在網(wǎng)頁制作過程中制作一個(gè)簡(jiǎn)單計(jì)算器功能是非常常見的需求,通過在文本輸入兩個(gè)數(shù),能夠?qū)崿F(xiàn)兩個(gè)數(shù)的加減乘除,主要通過parseFloat() 函數(shù),其語法介紹可以參考下本文

一、parseFloat() 函數(shù) 

在網(wǎng)頁中制作一個(gè)簡(jiǎn)單的計(jì)算器,在文本框輸入兩個(gè)數(shù),能夠?qū)崿F(xiàn)兩個(gè)數(shù)的加減乘除。
parseFloat() 函數(shù)可解析一個(gè)字符串,并返回一個(gè)浮點(diǎn)數(shù)。
該函數(shù)指定字符串中的首個(gè)字符是否是數(shù)字。如果是,則對(duì)字符
串進(jìn)行解析,直到到達(dá)數(shù)字的末端為止,然后以數(shù)字返回該數(shù)字,
而不是作為字符串。
語法:parseFloat(string);

二、JavaScript 全局屬性    

屬性 描述
Infinity 代表正的無窮大的數(shù)值。
NaN 指示某個(gè)值是不是數(shù)字值。
undefined 指示未定義的值。

三、完整代碼

<!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() 函數(shù)可解析一個(gè)字符串,并返回一個(gè)浮點(diǎn)數(shù)。
           該函數(shù)指定字符串中的首個(gè)字符是否是數(shù)字。如果是,則對(duì)字符
           串進(jìn)行解析,直到到達(dá)數(shù)字的末端為止,然后以數(shù)字返回該數(shù)字,
           而不是作為字符串。
        */
            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()">計(jì)算</button>
</div>
</body>
</html>

效果展示:

在這里插入圖片描述

到此這篇關(guān)于html輸入兩個(gè)數(shù)實(shí)現(xiàn)加減乘除的文章就介紹到這了,更多相關(guān)html加減乘除內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持腳本之家!

相關(guān)文章

最新評(píng)論