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 ...
随机推荐
- 三、使用maven创建scala工程（scala和java混一起）
本文先叙述如何配置eclipse中maven+scala的开发环境,之后,叙述如何实现spark的本地运行.最后,成功运行scala编写的spark程序. 刚开始我的eclipse+maven环境是配 ...
- java基础知识（2）---语法基础
二:java语法基础: 1,关键字:其实就是某种语言赋予了特殊含义的单词. 保留字:其实就是还没有赋予特殊含义,但是准备日后要使用过的单词. 2,标示符:其实就是在程序中自定义的名词.比如类名,变量名 ...
- k8s 基础 k8s架构和组件
k8s 的总架构图
- Tiny4412 LED 硬件服务
1.Android系统中启动框架 2.首先实现驱动程序 #include <linux/kernel.h> #include <linux/module.h> #include ...
- 3DES加密/解密
/// <summary> /// C#/PHP/JSP 3DES 加密与解密(只支持UTF-8编码) /// </summary> public class Crypto3D ...
- 关于request的几个字段值
domain: localhost host: localhost:9000 url: /wechat/mynews action: WechatController.myNews path: /we ...
- IO系列之File
1 File类 1.1 目录列表器 在这里我主要是参考Think in Java的内容从而做的一些总结以及扩展.Java中的IO流的设计应该说是Java中最经典的,最学院式的设计,包括它的整体架构设计 ...
- AngularJs(Part 6)
Overcomming same-origin policy restrictions with JSONP. AJAX has a restriction that it can only retr ...
- N72烧写
1.打开MFGTOOL.exe烧写工具:上电之前,先短接左下脚,当查看到MFGTOOL工具扫描到工具之后,点击开始,过2分钟左右烧写完成:完成之后电源要拔插以下!! 2.利用---生产工具V1.3 2 ...
- Sublime Text 3下安装Emmet的问题
电脑装了Sublime Text 3,顺便安装了很多插件,今天编写前端HTML代码时,想用起前端常用的Emmet插件的功能,Emmet插件已经安装好了,奈何输入简写格式,按“CTRL+E”,没有反应. ...