javascript计算器小程序

简介:     javascript测试             var n1 = '', n2 = '';         var item1_flag = true; //默认设置为第一运算符         var opr_type = '...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>javascript测试</title>
    <script type="text/javascript" language="javascript">
        var n1 = '', n2 = '';
        var item1_flag = true; //默认设置为第一运算符
        var opr_type = '+';  //运算符默认是加号
        //设置初始值函数
        function SetVal(item) {           
            document.Cal.OutText.value += item;//字符串的连接
            if (item1_flag) {
                n1 += item;
            }
            else
                n2 += item;
        }
        //再输入框中输入运算符
        function SetOpr(opr) {
            document.Cal.OutText.value += opr;
            item1_flag = false
            opr_type = opr;
        }
        //清屏函数
        function Clear() {
            document.Cal.OutText.value = "";
            item1_flag = true;
            opr_type = '+';
            n1 = '';
            n2 = '';
        }
        //计算表达式的值
        function Compute(obj) {
            var Result;
            if ((n1 != '') && (n2 != '')) {
                if ((eval(n2) == 0) && (opr_type == '/')) {
                    alert('除数不能为0!');
                    Clear();
                    return;
                }
                else {
                    Result = eval(obj.OutText.value);
                    document.Cal.OutText.value += '=';
                    document.Cal.OutText.value += Result;
                }


            }
        }
    </script>
    <link href="StyleSheet.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <div align="center">
        <form name="Cal" action="#" >
            <input type="text" value="" name="OutText" /><br /><br />
            <input type="button" class="button1" value="0" onclick="SetVal('0')" />
            <input type="button" class="button1" value="1" onclick="SetVal('1')" />
            <input type="button" class="button1" value="2" onclick="SetVal('2')" />
            <input type="button" class="button1" value="3" onclick="SetVal('3')" /><br /><br />
            <input type="button" class="button1" value="4" onclick="SetVal('4')" />
            <input type="button" class="button1" value="5" onclick="SetVal('5')" />
            <input type="button" class="button1" value="6" onclick="SetVal('6')" />
            <input type="button" class="button1" value="7" onclick="SetVal('7')" /><br /><br />
            <input type="button" class="button1" value="8" onclick="SetVal('8')" />
            <input type="button" class="button1" value="9" onclick="SetVal('9')" />
            <input type="button" class="button1" value="+" onclick="SetVal('+')" />
            <input type="button" class="button1" value="-" onclick="SetVal('-')" /><br /><br />
            <input type="button" class="button1" value="*" onclick="SetVal('*')" />
            <input type="button" class="button1" value="/" onclick="SetVal('/')" />
            <input type="button" class="button1" value="CE" onclick="Clear()" />
            <input type="button" class="button1" value="=" onclick="Compute(this.form)" />
        </form>
    </div>
</body>
</html>
相关文章
|
2月前
|
JavaScript
Node.js【GET/POST请求、http模块、路由、创建客户端、作为中间层、文件系统模块】(二)-全面详解(学习总结---从入门到深化)
Node.js【GET/POST请求、http模块、路由、创建客户端、作为中间层、文件系统模块】(二)-全面详解(学习总结---从入门到深化)
27 0
|
2月前
|
消息中间件 Web App开发 JavaScript
Node.js【简介、安装、运行 Node.js 脚本、事件循环、ES6 作业队列、Buffer(缓冲区)、Stream(流)】(一)-全面详解(学习总结---从入门到深化)
Node.js【简介、安装、运行 Node.js 脚本、事件循环、ES6 作业队列、Buffer(缓冲区)、Stream(流)】(一)-全面详解(学习总结---从入门到深化)
76 0
|
1天前
|
JavaScript 前端开发 测试技术
学习JavaScript
【4月更文挑战第23天】学习JavaScript
7 1
|
9天前
|
JavaScript 前端开发 应用服务中间件
node.js之第一天学习
node.js之第一天学习
|
1月前
|
运维 JavaScript 前端开发
发现了一款宝藏学习项目,包含了Web全栈的知识体系,JS、Vue、React知识就靠它了!
发现了一款宝藏学习项目,包含了Web全栈的知识体系,JS、Vue、React知识就靠它了!
|
1月前
|
JavaScript
Vue.js学习详细课程系列--共32节(4 / 6)
Vue.js学习详细课程系列--共32节(4 / 6)
35 0
|
1月前
|
前端开发 搜索推荐 JavaScript
编程笔记 html5&css&js 001 学习编程从网页开始
编程笔记 html5&css&js 001 学习编程从网页开始
|
2月前
|
前端开发 JavaScript
从零开始学习前端开发:HTML、CSS、JavaScript入门指南
【2月更文挑战第1天】本文将带领读者从零开始学习前端开发,介绍HTML、CSS和JavaScript的基础知识与应用,帮助读者快速入门前端开发领域。
64 1
|
2月前
|
数据采集 机器学习/深度学习 JavaScript
画【Python折线图】的一百个学习报告(二、pyecharts引入js文件)
画【Python折线图】的一百个学习报告(二、pyecharts引入js文件)
51 0
|
2月前
|
JSON 前端开发 JavaScript
Webpack【Webpack图片处理、Webpack中proxy代理 、自动清理dist、Webpack优化、JavaScript中的代码检查】(三)-全面详解(学习总结---从入门到深化)
Webpack【Webpack图片处理、Webpack中proxy代理 、自动清理dist、Webpack优化、JavaScript中的代码检查】(三)-全面详解(学习总结---从入门到深化)
35 0
Webpack【Webpack图片处理、Webpack中proxy代理 、自动清理dist、Webpack优化、JavaScript中的代码检查】(三)-全面详解(学习总结---从入门到深化)