计算器html js php代码,Javascript 实现简单计算器实例代码

太过爱你忘了你带给我的痛 2022-11-17 03:50 198阅读 0赞

效果图：

![b2790a4878cb33e82f3760d397ac9d5a.png][]

刚开始做时没考虑到清零和退格两个功能，嘻嘻，后来加的整体与传统计算器比有点小瑕疵。

代码：

js简单计算器

\*\{

margin:0px;

padding:0px;

\}

input\{

margin-top:2px;

margin-left:2px;

width:230px;

height:30px;

text-align:right;

\}

button\{

margin-top:2px;

margin-left:2px;

width:50px;

height:50px;

\}

\#container\{

margin-left:1px;

border:1px solid \#E4E4E4;

background:\#BBBBBB;

width:235px;

height:215px;

\}

function onLoad()\{

//加载完毕后光标自动对应到输入框

document.getElementById("input").focus();

\}

//读取按钮的值，传给输入框

function inputEvent(e)\{

//把val的值改为每个事件的innerHTML值

var val=e.innerHTML;

//获取input标签

var xsval=document.getElementById("input");

//标签里的value连接每个事件的innerHTML值

xsval.value+=val;

\}

//计算出结果

function inputOper()\{

var xsval=document.getElementById("input");

xsval.value=eval(document.getElementById("input").value);

\}

//清零

function clearNum()\{

var xsval=document.getElementById("input");

xsval.value="";

document.getElementById("input").focus();

\}

//退格

function backNum()\{

var arr=document.getElementById("input");

arr.value=arr.value.substring(0,arr.value.length-1);

\}

1

2

3

\+

4

5

6

\-

7

8

9

\*

0

.

=

/

清零

退格

本文原创发布php中文网，转载请注明出处，感谢您的尊重！

[b2790a4878cb33e82f3760d397ac9d5a.png]: /images/20221022/00b51d5e2a914e5dbb63e5ab9a3b2f4c.png

发表评论取消回复

表情：

评论列表（有 0 条评论，198人围观）

还没有评论，来说两句吧...

相关阅读

相关好看的前端计算器代码分享（html+css+js制作计算器）

好看的前端计算器代码分享（html+css+js制作计算器）简介：这里分享的html+css+js制作的几个计算器代码。第一个 demo演示 ![在这里插

冷不防/ 2024年03月24日 13:36/ 0 赞/ 5 阅读

相关计算器html js php代码,Javascript 实现简单计算器实例代码

效果图： ![b2790a4878cb33e82f3760d397ac9d5a.png][] 刚开始做时没考虑到清零和退格两个功能，嘻嘻，后来加的整体与传统计算器比有点小瑕

太过爱你忘了你带给我的痛/ 2022年11月17日 03:50/ 0 赞/ 199 阅读

相关 HTML5+CSS3+JS：计算器（代码全+解析+实现结果）

HTML如何实现一个计算器？ ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNz

刺骨的言语ヽ痛彻心扉/ 2022年11月16日 10:45/ 0 赞/ 322 阅读

相关 java全面的计算器代码_Java实现计算器的代码

用java 实现的计算器，原理看代码注释，具体内容如下 public class mycalculator \{ public static void main(strin

矫情吗；*/ 2022年11月08日 14:26/ 0 赞/ 197 阅读

相关 IOS小型计算器实例代码2

IOS小型计算器实例代码2 原文链接：[http://blog.sina.com.cn/s/blog\_bf9843bf0101fca3.html][http_b

男娘i/ 2022年09月18日 12:48/ 0 赞/ 191 阅读

相关 js 简单计算器

将字符串转成浮点型函数：parseFloat（"12.3"）; <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans

迷南。/ 2022年06月14日 03:56/ 0 赞/ 261 阅读

相关 HTML/JS 简单计算器

<p>简单计算器:</p> <table border="1" style="position:center;"> <tr> <td>第一个数：</td

你的名字/ 2022年06月06日 09:47/ 0 赞/ 214 阅读

相关 HTML+CSS+Javascript 实现简单计算器

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>

小咪咪/ 2022年06月05日 08:17/ 0 赞/ 243 阅读

相关 html+css+js 实现简单计算器

效果图: ![70][] 代码: <html> <head> <title>计算器</title> <meta charset=gb2

分手后的思念是犯贱/ 2022年05月14日 10:34/ 0 赞/ 313 阅读

相关 js简单计算器

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <ti

矫情吗；*/ 2022年05月13日 08:34/ 0 赞/ 249 阅读