JS——制作简单的网页计算器
用JS做了一个简易的网页计算器
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>计算器</title>
<script type="text/javascript"> window.onload = function () { var oInput01 = document.getElementById('input01');
var oInput02 = document.getElementById('input02');
var oFuhao = document.getElementById('fuhao');
var oBtn = document.getElementById('btn'); oBtn.onclick = function(){
var num01 = oInput01.value;
var num02 = oInput02.value;
var fuhao = oFuhao.value; //验证是否为空
if(num01==''||num02==''){
alert('输入框不能为空！');
return;
}
if(isNaN(num01)||isNaN(num02)){
alert('请输入数字！');
return;
} switch (fuhao){
//这个value是字符串！
case "0":
alert((parseFloat(num01)*100+parseFloat(num02)*100)/100);
break;
case '1':
alert((parseFloat(num01)*100-parseFloat(num02)*100)/100);
break;
case "2":
alert(((parseFloat(num01)*100)*(parseFloat(num02)*100))/10000);
break;
case '3':
alert(((parseFloat(num01)*100)/(parseFloat(num02)*100)));
}
}
}
</script>
</head>
<body>
<h1>计算器</h1>
<input type="text" name="" id="input01">
<select id="fuhao">
<option value="0">+</option>
<option value="1">-</option>
<option value="2">*</option>
<option value="3">/</option>
</select>
<input type="text" name="" id="input02">
<input type="button" name="" value="计算" id="btn">
</body>
</html>
JS——制作简单的网页计算器的更多相关文章
- js制作简单的计算器
学着做了一个简单的计算器!记录记录!哈哈 <!DOCTYPE html> <html> <head> <title>简单的计算器</title&g ...
- html制作简单框架网页 实现自己的音乐驿站 操作步骤及源文件下载 （播放功能限mp3文件）
使用HTML语言来设计制作 Hyper Text Markup Language 超文本标记语言 这门语言的特点就是标记,就是把所有的命令单词用<>标记起来,就可以发挥作用 还有一个特点, ...
- d3.js 制作简单的俄罗斯方块
d3.js是一个不错的可视化框架,同时对于操作dom也是十分方便的.今天我们使用d3.js配合es6的类来制作一个童年小游戏--俄罗斯方块.话不多说先上图片. 1. js tetris类 由于方法拆分 ...
- d3.js 制作简单的贪吃蛇
d3.js是一个不错的可视化框架,同时对于操作dom也是十分方便的.今天我们使用d3.js配合es6的类来制作一个童年小游戏–贪吃蛇.话不多说先上图片. 1. js snaker类 class Sna ...
- JQuery制作简单的网页导航特效
使用JQuery中hover()方法,使其根据鼠标的移动简单的改变背景颜色; hover();用于模拟鼠标指针悬停事件,当鼠标指针移动到元素上时,会触发指定的第一个函数,当鼠标指针移除这个元素时,会触 ...
- html制作简单框架网页二 实现自己的影音驿站 操作步骤及源文件下载 （可播放mp4、avi、mpg、asx、swf各种文件的视频播放代码）
新增视频播放功能如下图: 左侧网页left.html代码如下: <meta charset="utf-8"> <body style="backgrou ...
- jsp学习---使用jsp和JavaBean实现超简单网页计算器
一.需求 如题,用jsp实现一个超简单的网页计算器. 二.实现 1.效果图 1)初始界面: 2)随便输入两个数进行相乘: 3)当除数为零时提示报错: 2.代码 Calculator.java pack ...
- 利用css+原生js制作简易钟表
利用css+原生js制作简单的钟表.效果如下所示 实现该效果,分三大块:html.javascript.css html部分html部分比较简单,定义一个clock的div,内部有原点.时分秒针.日期 ...
- JS制作图片切换
<!DOCTYPE html> <html> <head> <title>纯JS制作简单的图片切换</title> <meta cha ...
随机推荐
- Tangent space(切线空间)
https://en.wikipedia.org/wiki/Frenet%E2%80%93Serret_formulas The tangent, normal, and binormal unit ...
- “Hello World”—— 第一个汇编程序
Hello World这是每一门编程语言的第一个最简单程序,下面那个程序就是汇编语言的Hello World.学汇编一段时间了,到现在才记录下自己的第一个汇编程序笔记.虽然这是个相当简单的小程序,但这 ...
- 用Azure CLI批量上传文件
在Windows环境下,我们可以使用AzCopy批量上传文件.其效率和传输速率都是非常快的. 在Linux或MacOS环境下,可以使用Azure的CLI实现批量文件的上传. 下面的脚本可以实现此功能. ...
- HDOJ1272(并查集，判断是否为树)
0 0 Yes 1 1 0 0 Yes 1 2 2 1 0 0 No //自回路不算一条边的! 居然有 0 0 这样的测试数据 #include<iostream> #include< ...
- boost asio中io_service类的几种使用
io_service类 你应该已经发现大部分使用Boost.Asio编写的代码都会使用几个io_service的实例.io_service是这个库里面最重要的类:它负责和操作系统打交道,等待所有异步操 ...
- java web基础学习 Forward和Redirect区别
Forward和Redirect代表了两种请求转发方式:直接转发和间接转发.对应到代码里,分别是RequestDispatcher类的forward()方法和HttpServletRequest类的s ...
- Project Server调用PSI关闭任务以进行更新锁定任务
/// <summary> /// 锁定和解锁项目任务 /// </summary> /// <param name="projectuid"> ...
- struts2.Action中的method属性配置
.Action中的method属性 在struts1.x中我们知道通过继承DispatchAction可以实现把多个Action进行统一操作,在struts2中实现action的统一操作也很简单.我们 ...
- p2921 Trick or Treat on the Farm
传送门 题目 每年万圣节,威斯康星的奶牛们都要打扮一番,出门在农场的N个牛棚里转 悠,来采集糖果.她们每走到一个未曾经过的牛棚,就会采集这个棚里的1颗糖果.农场不大,所以约翰要想尽法子让奶牛们得到快乐 ...
- nodebrew
创建: 2019/05/30 完成: 2019/05/30 安装 安装 curl -L git.io/nodebrew | perl - setup 更新nodebrew nodebrew sel ...