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 ...
随机推荐
- bzoj 3730 震波 —— 动态点分治+树状数组
题目:https://www.lydsy.com/JudgeOnline/problem.php?id=3730 建点分树,每个点记两个树状数组,存它作为重心管辖的范围内,所有点到它的距离情况和到它在 ...
- CentOS6和CentOS7服务开机启动
CentOS 6和CentOS 7都可以定义开机启动哪些服务,但CentOS 6的命令是chkconfig,CentOS 7是systemctl. 本文将介绍两种命令的实现方式. 一.CentOS 6 ...
- Python：struct模块的pack、unpack
mport struct pack.unpack.pack_into.unpack_from 1 # ref: http://blog.csdn<a href="http://lib. ...
- Python之常用模块（二）
shelve xml处理 configparser hashlib logging shelve模块 shelve是一个简单的k,v将内存数据通过文件持久化的模块,可以持久化任何pickle可支持 ...
- python 接口测试字符类型转换
接口返回数据: print sql[0][10] {"recv_name":"rdgztest_63126","send_name":&qu ...
- glusterfs安装配置简单使用
GlusterFS是一种分布式分布式文件系统,默认采用无中心完全对等架构,搭建维护使用十分简单,是很受欢迎的分布式文件系统. 官网https://www.gluster.org/,官网上表示Glust ...
- 1 ELK 简介
日志主要包括系统日志.应用程序日志和安全日志,系统运维和开发人员可以通过日志了解服务器软硬件信息.检查配置过程中的错误及错误发生的原因.经常分析日志可以了解服务器的负荷,性能安全性,从而及时采取措施纠 ...
- RS485总线防雷保护方案
RS485作为最为最常用的电表通讯方式之一.日常生活中雷电和静电干扰已经成为485通信总线在实际工程经常遇到的问题.故如何对芯片以及总线进行有效的保护,是摆在每一个使用者面前的一个问题.在这里,我们主 ...
- Windows部署jenkins服务器
本次使用的操作系统: windows server 2012 r2vs版本: vs 2015jenkins: 2.19.4 一.下载jenkins http://mirror.xmission.com ...
- Project Online JS 添加Ribbon按钮
var Projects = Projects || {}; (function () { Projects.ribbonButtonClick = function (name) { var pro ...