编程 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 相关文章推荐

5个JavaScript经典面试题

Oct 13 Javascript

jQuery中$.get、$.post、$.getJSON和$.ajax的用法详解

Nov 19 Javascript

JS实现的生成随机数的4个函数分享

Feb 11 Javascript

js中通过getElementsByName访问name集合对象的方法

Oct 31 Javascript

javascript入门之window对象【新手必看】

Nov 22 Javascript

JavaScript 保护变量不被随意修改的实现代码

Sep 27 Javascript

vue+webpack实现异步组件加载的方法

Feb 03 Javascript

React中嵌套组件与被嵌套组件的通信过程

Jul 11 Javascript

详解用JS添加和删除class类名

Mar 25 Javascript

Vue路由守卫及页面登录权限控制的设置方法(两种)

Mar 31 Javascript

详解JavaScript中的数据类型，以及检测数据类型的方法

Sep 17 Javascript

EXTJS7实现点击拖拉选择文本

Dec 17 Javascript

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 substr 截取字符串出现乱码问题解决方法[utf8与gb2312]

2011/12/16 PHP

php使用百度翻译api示例分享

2014/01/31 PHP

详解PHP中strlen和mb_strlen函数的区别

2014/03/07 PHP

用JavaScript页面不刷新时全选择，全删除（GridView）

2009/04/14 Javascript

javascript取消文本选定的实现代码

2010/11/14 Javascript

jquery select(列表)的操作（取值/赋值）

2011/03/16 Javascript

jQuery.validate 常用方法及需要注意的问题

2013/03/20 Javascript

Jquery中ajax方法data参数的用法小结

2014/02/12 Javascript

JavaScript实现DIV层拖动及动态增加新层的方法

2015/05/12 Javascript

javascript解决IE6下hover问题的方法

2015/07/28 Javascript

基于insertBefore制作简单的循环插空效果

2015/09/21 Javascript

avalon js实现仿google plus图片多张拖动排序附源码下载

2015/09/24 Javascript

AngularJS 中的指令实践开发指南(一)

2016/03/20 Javascript

AngularJS入门教程之MVC架构实例分析

2016/11/01 Javascript

利用Vue v-model实现一个自定义的表单组件

2017/04/27 Javascript

值得收藏的vuejs安装教程

2017/11/21 Javascript

jQuery length 和 size()区别总结

2018/04/26 jQuery

详解Node.js中path模块的resolve()和join()方法的区别

2018/10/29 Javascript

解决vue跨域axios异步通信问题

2019/04/17 Javascript

Python实现partial改变方法默认参数

2014/08/18 Python

python strip() 函数和 split() 函数的详解及实例

2017/02/03 Python

Python解析json之ValueError: Expecting property name enclosed in double quotes: line 1 column 2（char 1）

2017/07/06 Python

用 Python 爬了爬自己的微信朋友(实例讲解)

2017/08/25 Python

python如何重载模块实例解析

2018/01/25 Python

Python实现爬虫从网络上下载文档的实例代码

2018/06/13 Python

用python写测试数据文件过程解析

2019/09/25 Python

pytorch中nn.Conv1d的用法详解

2019/12/31 Python

Hotter Shoes英国官网：英伦风格，舒适的鞋子

2017/12/28 全球购物

类的返射机制中的包及核心类

2016/09/12 面试题

焊接专业毕业生求职信

2013/10/01 职场文书

医学院毕业生自荐信范文

2014/03/06 职场文书

青春演讲稿范文

2014/05/08 职场文书

事业单位鉴定材料

2014/05/25 职场文书

有限责任公司股东合作协议书范本

2014/10/30 职场文书

导游词之南京汤山温泉

2019/11/26 职场文书

详细了解java监听器和过滤器

2021/07/09 Java/Android