html输入两个数实现加减乘除功能
2021-07-11 16:54
1161 查看
一、parseFloat() 函数
在网页中制作一个简单的计算器,在文本框输入两个数,能够实现两个数的加减乘除。
parseFloat() 函数可解析一个字符串,并返回一个浮点数。
该函数指定字符串中的首个字符是否是数字。如果是,则对字符
串进行解析,直到到达数字的末端为止,然后以数字返回该数字,
而不是作为字符串。
语法:parseFloat(string);
二、JavaScript 全局属性
属性 | 描述 |
---|---|
Infinity | 代表正的无穷大的数值。 |
NaN | 指示某个值是不是数字值。 |
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() 函数可解析一个字符串,并返回一个浮点数。 该函数指定字符串中的首个字符是否是数字。如果是,则对字符 串进行解析,直到到达数字的末端为止,然后以数字返回该数字, 而不是作为字符串。 */ 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加减乘除内容请搜索脚本之家以前的文章或继续浏览下面的相关文章,希望大家以后多多支持脚本之家!
相关文章推荐
- java 优化版 用接口实现(输入两个数选择实现加减乘除运算)
- jQuery+html5+css3实现圆角无刷新表单带输入验证功能代码
- php自定义函数br2nl实现将html中br换行符转换为文本输入中换行符的方法【与函数nl2br功能相反】
- 实现两个数的加减乘除功能
- jQuery+html5+css3实现圆角无刷新表单带输入验证功能代码
- PHP+MySQL实现输入页码跳转到指定页面功能示例
- ASP.NET实现License Key输入功能
- html+css+jQuery实现多种图片简单切换功能大综合
- 用JS在html页面实现打印功能
- ASP.NET实现License Key输入功能的小例子
- html 禁止input文本框输入实现属性
- (c++)有n个整数,使前面各数顺序向后移m个位置,最后m个数变成前面m个数,见图。写一函数:实现以上功能,在主函数中输入n个数和输出调整后的n个数。
- HTML附加功能实现(标签栏图表修改,发邮件,使用矢量图库)
- html <select> <option> 实现根据选择不同的option,调用不同的方法功能
- [置顶] HTML 实现可输入select标签
- 如何用js实现,在一个页面有个输入文档框,然后点击查询按扭后,调用IE的查询功能在当前页面进行查询
- html中的a标签用js来实现页面跳转的功能(php分页时做的页面跳转)
- Python3实现抓取javascript动态生成的html网页功能示例
- 基于MUI框架的使用HTML5+实现的二维码扫描功能并且其结果在webview中的信息的传递
- 1.java.io包中定义了多个流类型来实现输入和输出功能,