html制作计算器val,JavaScript实现的超简单计算器功能示例
本文实例讲述了JavaScript实现的超简单计算器功能。分享给大家供大家参考,具体如下:
先来看看运行效果:
具体代码:
www.ddpool.cn JS计算器
// window.onload 获取元素getElementById
window.onload = function(){
var oTxt1 = document.getElementById('val01');
var oTxt2 = document.getElementById('val02');
var oFuhao = document.getElementById('fuhao');
// 这三个要放在button函数里面,因为s1.value是获取input里面的输入,但是这个时候还没有输入了
// var iNum1 = oTxt1.value;
// var iNum2 = oTxt2.value;
// var iNum3 = oFuhao.value;
oBtn = document.getElementById('btn');
// 计算按钮点击事件
oBtn.onclick = function(){
var iNum1 = oTxt1.value;
var iNum2 = oTxt2.value;
var iNum3 = oFuhao.value;
var iResult;
//如果两个输入有一个是空的话 //return是让if里面执行结束
if (iNum1=='' || iNum2=='') {
alert('不能为空');
return;
} //isNaN() 如果是true,说明是非数字,所以如果两个输入中有非数字,就提示alert
if (isNaN(iNum1) || isNaN(iNum2)) {
alert('不能有字母');
return;
} //对+-*/四个操作对应的value进行判断 //如果直接iNum1+iNum2 输出的结果是字符串的拼接 12+24 1224 所以要转换成parseInt整数
if (iNum3 == 0) {
iResult = parseInt(iNum1) + parseInt(iNum2)
}
else if (iNum3 == 1) {
iResult = parseInt(iNum1) - parseInt(iNum2)
}
else if (iNum3 == 2) {
iResult = parseInt(iNum1) * parseInt(iNum2)
}
else if (iNum3 == 3) {
iResult = parseInt(iNum1)/parseInt(iNum2)
}
alert(iResult);
}
}
计算器
+
-
*
/
PS:这里再为大家推荐几款计算工具供大家进一步参考借鉴:
在线一元函数(方程)求解计算工具:http://tools.ddpool.cn/jisuanqi/equ_jisuanqi
科学计算器在线使用_高级计算器在线计算:http://tools.ddpool.cn/jisuanqi/jsqkexue
在线计算器_标准计算器:http://tools.ddpool.cn/jisuanqi/jsq
希望本文所述对大家JavaScript程序设计有所帮助。
html制作计算器val,JavaScript实现的超简单计算器功能示例相关推荐
- c语言字符笛卡尔积,JavaScript笛卡尔积超简单实现算法示例
本文实例讲述了JavaScript笛卡尔积超简单实现算法.分享给大家供大家参考,具体如下: JS笛卡尔积算法 function cartesianProductOf() { return Array. ...
- js装修计算器java代码_JavaScript代码实现简单计算器
本文实例为大家分享了JavaScript代码实现简单计算器的具体代码,供大家参考,具体内容如下 一.实现功能 (1)利用css样式.javascript语言和html语言实现计算器的算法 (2)对计算 ...
- html中选择日期怎么实现,JavaScript+HTML5实现的日期比较功能示例
本文实例讲述了JavaScript+HTML5实现的日期比较功能.分享给大家供大家参考,具体如下: 这里要在前面的文章<JavaScript实现设置默认日期范围为最近40天的方法>基础之上 ...
- python实现简单计算器功能键介绍_Python实现的简单计算器功能详解
本文实例讲述了Python实现的简单计算器功能.分享给大家供大家参考,具体如下: 使用python编写一款简易的计算器 计算器效果图 首先搭建计算器的面板: 计算器面板结构 建造一个继承于wx.Fra ...
- python编程简易计算器_Python编程练习049:简单计算器实现
以下代码用于实现简单计算器实现,包括两个数基本的加减乘除运算: 定义函数 def add(x, y): """相加""" return x ...
- C语言简单计算器报告5000字,c语言简单计算器报告.docx
c语言简单计算器报告 xxxx大学信息科学与工程学院 课程设计报告 班级:姓名:实验项目名称: 实验室(中心):指导教师: 实验完成时间: 通信工程一班 xxx 简易计算器信息科学与工程学院信息技术实 ...
- c语言设计程序计算器,C语言程序设计,做一个简单计算器
题目: C语言程序设计,做一个简单计算器 程序内容有:加减乘除和平方,立方,开方等.用if或者swith结构来编程. 算加法时只输出加法的结果,算减法时只出减法的结果,如此类推. 解答: 已发送, # ...
- java安卓编程计算器_菜鸟学Android编程——简单计算器《一》
菜鸟瞎搞,高手莫进 本人菜鸟一枚,最近在学Android编程,网上看了一些视频教程,于是想着平时手机上的计算器应该很简单,自己何不尝试着做一个呢? 于是就冒冒失失的开撸了. 简单计算器嘛,功能当然很少 ...
- c语言课程设计计算器软件,C语言课程设计简单计算器程序.docx
课程设计名称: C 语言课程设计课程设计题目: 简单计算器程序 目录 第1章 需求分析 0 设计要求 0 任务 0 第2章 总体设计 1 TOC \o "1-5" \h \z \o ...
最新文章
- linux中ftp用户,linux中怎么添加ftp用户
- Silverlight3 导航属性,Entity属性 的疑问
- office频繁显示停止工作
- python import 原理-Python之禅-import this的实现
- 无法连接到RDP服务器
- Samba平台搭建和用户自行修改密码环境搭建笔记
- Visual C++中最常用的类与API函数
- Elasticsearch7.15.2 修改IK分词器源码实现基于MySql8的词库热更新
- loadedapk.java_android,_java.lang.ClassCastException: android.os.BinderProxy,android - phpStudy
- Python入门--函数参数的定义,以及print输出格式的设置
- DEV皮肤(系统默认和自定义皮肤调用)
- 群表示论之二面体群的不可约实表示的求法
- 中国止血分析仪行业市场供需与战略研究报告
- 2017中国大学生计算机设计大赛总结
- RTKLIB基础函数等
- 某海外电商平台参数分析 ECDSA签名(js逆向)
- 美国L1签证申请的常见问题解析
- redis常用命令总结(慎入)
- 问题 F: 小白鼠排队
- 【图像处理】小波编码图像中伪影和纹理的检测(Matlab代码实现)