编程 Javascript

使用JavaScript 编写简单计算器

Posted in Javascript onNovember 24, 2014

本文方法超级简单，思路非常的值得推荐，小伙伴们参考下吧

<!DOCTYPE html> 

<html> 

<head> 

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  

    <title>javascript 简单计算器</title> 

    <script> 

        //定义全局变量         var one="1"; 

        var two="2"; 

        var three="3"; 

        var four="4"; 

        var five="5"; 

        var six="6"; 

        var seven="7"; 

        var eight="8"; 

        var nine="9"; 

        var zero="0"; 

         var plus="+",minus="-",multiply="*",divide="/",decimal="."; 

         function enter(obj,string){ 

                obj.expr.value+=string; 

            } 

         function compute(obj){//单击等于"="按钮调用的函数;                  obj.expr.value=eval(obj.expr.value);//用JS得eval()方法计算name为expr中的公式              } 

  </script> 

</head> 

<body> 

    <form name="calc" id="calc" action="">  

        <table border="1">  

        <td colspan="4"><input type="text" name="expr" size="30" action="compute(this.form)" /></td>  

        <tr>  

        <td><input type="button" value=" 7 " onclick="enter(this.form,seven)" /></td>  

        <td><input type="button" value=" 8 " onclick="enter(this.form,eight)" /></td>  

        <td><input type="button" value=" 9 " onclick="enter(this.form,nine)" /></td>  

        <td><input type="button" value=" / " onclick="enter(this.form,divide)" /></td>  

        </tr>  

        <tr>  

        <td><input type="button" value=" 4 " onclick="enter(this.form,four)" /></td>  

        <td><input type="button" value=" 5 " onclick="enter(this.form,five)" /></td>  

        <td><input type="button" value=" 6 " onclick="enter(this.form,six)" /></td>  

        <td><input type="button" value=" * " onclick="enter(this.form,multiply)" /></td>  

        </tr>  

        <tr>  

        <td><input type="button" value=" 1 " onclick="enter(this.form,one)" /></td>  

        <td><input type="button" value=" 2 " onclick="enter(this.form,two)" /></td>  

        <td><input type="button" value=" 3 " onclick="enter(this.form,three)" /></td>  

        <td><input type="button" value=" - " onclick="enter(this.form,minus)" /></td>  

        </tr>  

        <tr>  

        <td colspan="2"><input type="button" value=" 0 " onclick="enter(this.form,zero)" /></td>  

        <td><input type="button" value=" . " onclick="enter(this.form,decimal)" /></td>  

        <td><input type="button" value=" + " onclick="enter(this.form,plus)" /></td>  

        </tr>  

        <tr>  

        <td colspan="2"><input type="button" value=" = " onclick="compute(this.form)" /></td>  

        <td colspan="2"><input type="button" value="AC" onclick="form.reset()"/></td>  

        </tr>  

        </table>  

</form>  

</body> 

</html>

是不是超级NB的代码，大神级的！

- Author -

hebedich

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

javascript基础第一章 JavaScript与用户端

Jul 22 Javascript

基于JQuery实现图片轮播效果(焦点图)

Feb 02 Javascript

Angularjs 滚动加载更多数据

Mar 17 Javascript

JavaScript数据绑定实现一个简单的 MVVM 库

Apr 08 Javascript

vue.js中mint-ui框架的使用方法

May 12 Javascript

vue父组件通过props如何向子组件传递方法详解

Aug 16 Javascript

JS实现图片放大镜插件详解

Nov 06 Javascript

vue 的keep-alive缓存功能的实现

Mar 22 Javascript

Vue axios设置访问基础路径方法

Sep 19 Javascript

JS+HTML实现自定义上传图片按钮并显示图片功能的方法分析

Feb 12 Javascript

使用js和canvas实现时钟效果

Sep 08 Javascript

Vue中inheritAttrs的使用实例详解

Dec 31 Vue.js

JS和JQ的event对象区别分析

Nov 24 #Javascript

JavaScript实现大数的运算

Nov 24 #Javascript

使表格的标题列可左右拉伸jquery插件封装

Nov 24 #Javascript

jQuery实现隔行背景色变色

Nov 24 #Javascript

jQuery实现统计复选框选中数量

Nov 24 #Javascript

基于jQuery实现文本框缩放以及上下移动功能

Nov 24 #Javascript

基于jQuery实现复选框的全选全不选反选功能

Nov 24 #Javascript

You might like

PHP 设置MySQL连接字符集的方法

2011/01/02 PHP

php的hash算法介绍

2014/02/13 PHP

php使用多个进程同时控制文件读写示例

2014/02/28 PHP

PHP使用pcntl_fork实现多进程下载图片的方法

2014/12/16 PHP

php微信开发之自定义菜单完整流程

2016/10/08 PHP

利用PHP访问MySql数据库的逻辑操作以及增删改查的实例讲解

2017/08/30 PHP

PHP的new static和new self的区别与使用

2019/11/27 PHP

JavaScript使用技巧精萃[代码非常实用]

2008/11/21 Javascript

Extjs4中Form的使用之本地hiddenfield

2013/11/26 Javascript

js onmousewheel事件多次触发问题解决方法

2014/10/17 Javascript

JavaScript操作Oracle数据库示例

2015/03/06 Javascript

jQuery实现的漂亮表单效果代码

2015/08/18 Javascript

AngularJS中的拦截器实例详解

2017/04/07 Javascript

基于node.js制作简单爬虫教程

2017/06/29 Javascript

详解vue2.0 使用动态组件实现 Tab 标签页切换效果（vue-cli）

2017/08/30 Javascript

原生javascript实现文件异步上传的实例讲解

2017/10/26 Javascript

JavaScript函数式编程(Functional Programming)组合函数(Composition)用法分析

2019/05/22 Javascript

关于vue3.0中的this.$router.replace({ path: '/'})刷新无效果问题

2020/01/16 Javascript

Vue实现导航栏菜单

2020/08/19 Javascript

VUE-ElementUI 自定义Loading图操作

2020/11/11 Javascript

详解Python开发中如何使用Hook技巧

2017/11/01 Python

python+selenium实现京东自动登录及秒杀功能

2017/11/18 Python

python简单实现AES加密和解密

2019/03/28 Python

django的聚合函数和aggregate、annotate方法使用详解

2019/07/23 Python

python-视频分帧&多帧合成视频实例

2019/12/10 Python

CSS3实现粒子旋转伸缩加载动画

2016/04/22 HTML / CSS

使用CSS3制作版头动画效果

2020/12/24 HTML / CSS

Kathmandu美国网站：新西兰户外运动品牌

2019/03/23 全球购物

遗体告别仪式答谢词

2014/01/23 职场文书

国贸专业求职信

2014/06/28 职场文书

员工趣味活动方案

2014/08/27 职场文书

四风剖析查摆对照检查材料思想汇报

2014/09/24 职场文书

乡镇司法所2015年度工作总结

2015/10/14 职场文书

2016年9月份红领巾广播稿

2015/12/21 职场文书

Python数据分析之绘图和可视化详解

2021/06/02 Python

vue3 自定义图片放大器效果的示例代码

2022/07/23 Vue.js