在线计算器源码（HTML+CSS+jQuery）

最新推荐文章于 2024-07-31 22:41:01 发布

原创

最新推荐文章于 2024-07-31 22:41:01 发布 · 4.3k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#jquery #html #css #javascript #源代码

本文介绍了一个作为前端学习练习的在线计算器的开发，功能包括基本运算、平方根计算及键盘输入。虽然存在小数点显示、负数输入等BUG，但不影响计算。未实现的功能包括百分比计算、记忆加减和小数位数设置等。附带源代码。

一、简介

最近学习前端内容，做为练习，试开发了一个在线的计算器。

具有如下功能：

1. +-*/运算；
2. 开平方根运算；
3. 支持键盘输入（delete键设置为初始化功能）。

目前存在的BUG：

输入小数时，初次输入小数点，其会显示在数字最左侧，经测试，应为input标签的问题；

负数的输入；

结果为负时，负号（即减号）显示在数字的右侧。

以上1和3两个BUG，均仅为显示问题，影响用户读数，不影响计算。因时间问题，BUG没有处理。仅描述一下解决BUG的思路：1、关于小数占负号显示。可将其以替换字符顺序的方式正确显示。2，负数的输入问题。strNum为初始值时，绕过运算开关，并将负号赋给strNum变量并退出函数。不操作运算符。

未完成的功能：

百分比计算；

记忆加减和清除；

小数点后的保留位数设置和进位法则设置。

留待以后有时间了再写来玩。

二、源代码

源代码都比较简单，就不做更多说明了。（我设想的展示顺序为HTML->CSS ->JS，优快云给我的展示顺序是CSS->JS->HTML。因引用的是代码片，优快云也还在学用，不知道怎么修改代码片里文件顺序。有知道的评论告诉一下。）
    
    
     
     
    在线计算器
     rel="stylesheet" type="text/css" href="css/calcStyl