<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script>
window.onload = function()
{
var oTxt1 = document.getElementById("txt1");
var oTxt2 = document.getElementById("txt2");

var oSel1 = document.getElementById("sel1");

var oBtn1 = document.getElementById("btn1");
var oSpa1 = document.getElementById("spa1");

oBtn1.onclick=function()
{
var a1 = parseFloat(oTxt1.value);
var a2 = parseFloat(oTxt2.value);

var result;

switch(oSel1.value)
{
case "+":result=a1+a2;
break;
case "-":result=a1-a2;
break;
case "*":result=a1*a2;
break;
case "/":result=a1/a2;
break;
case "%":result=a1%a2;
break;

}
oSpa1.innerHTML = result;
}



}
</script>
</head>

<body>
<input type="text" id="txt1" />
<select id="sel1">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
<option value="%">%</option>
</select>
<input type="text" id="txt2" />
<input type="button" value="计算" id="btn1" />
<span id="spa1"></span>
</body>
</html>

javascript平时小例子⑥(简易计算器的制作)的更多相关文章

  1. javascript平时小例子⑨(小型抽奖功能)

    <!doctype html><html lang="en"> <head> <meta charset="utf-8" ...

  2. javascript平时小例子⑧(导航置顶效果)

    <!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title> ...

  3. javascript平时小例子⑦(鼠标跟随的div)

    <!doctype html><html> <head> <meta charset="utf-8"> <title>无 ...

  4. javascript平时小例子⑤(投票效果的练习)

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...

  5. javascript平时小例子④（setInterval使用2）

    <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>& ...

  6. javascript平时小例子③（setInterval使用1）

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...

  7. javascript平时小例子②（正则表达式验证邮箱）

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>邮 ...

  8. javascript平时小例子①（移动的小div）

    css样式: #box{ width: 300px; height: 300px; background: deepskyblue; position: absolute; margin-right: ...

  9. 微信小程序-简易计算器

    代码地址如下:http://www.demodashi.com/demo/14210.html 一.前期准备工作 软件环境:微信开发者工具 官方下载地址:https://mp.weixin.qq.co ...

随机推荐

  1. MOB 短信验证

    工具/原料   Android Studio mob SDK中的jar 和.so文件 方法/步骤   1 把3个jar 放入libs   并添加依赖 在项目的build.gradle里面   在你的项 ...

  2. python装饰器--@property

    @property 考察 Student 类: class Student(object): def __init__(self, name, score): self.name = name sel ...

  3. mysql root用户 远程登录其它机器，看不到数据库

    在102上访问101上的数据库里,show databases;看不到里面的库, 需要在101上授权就可以了 GRANT ALL PRIVILEGES ON *.* TO 'root'@'192.16 ...

  4. java中HashMap详解

    HashMap 和 HashSet 是 Java Collection Framework 的两个重要成员,其中 HashMap 是 Map 接口的常用实现类,HashSet 是 Set 接口的常用实 ...

  5. 如何创建一个Android项目

    第一步: File -->New ---->Android Application Project 点击创建 第二步:接下来是几个下拉选择框. Minimum Required SDK 是 ...

  6. SpringHttpInvoker解析2-服务端实现

    主要的配置文件 <!-- 在Spring的httpInvoker服务 --> <bean id="httpInvokerUserService" class=&q ...

  7. 20145223《Java程序程序设计》第8周学习总结

    20145223 <Java程序设计>第8周学习总结 教材学习内容总结 第十四章 NIO与NIO2 ·NIO使用频道(Channel)来衔接数据节点,在处理数据时,NIO可以让你设定缓冲区 ...

  8. 如何用distinct消除重复记录的同时又能选取多个字段值？

    http://www.cnblogs.com/warioland/archive/2012/05/30/2526128.html

  9. Java List与数组之间的转换

    http://blog.csdn.net/kingzone_2008/article/details/8444678

  10. 20145308刘昊阳 《Java程序设计》第2周学习总结

    20145308刘昊阳 <Java程序设计>第2周学习总结 教材学习内容总结 第三章 基础语法 3.1 类型.变量与运算符 类型 基本类型 整数(short/int/long) short ...