页面样式


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
// 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); }
} </script>
</head>
<body>
<h3>计算器</h3>
<input type="text" id="val01">
<select id="fuhao">
<option value="0">+</option>
<option value="1">-</option>
<option value="2">*</option>
<option value="3">/</option>
</select>
<input type="text" id="val02">
<input type="button" id="btn" value="计算"> </body>
</html>

javascrip 实现简单的计算器功能的更多相关文章

  1. JS事件 编程练习-自制计算器 使用JS完成一个简单的计算器功能。实现2个输入框中输入整数后,点击第三个输入框能给出2个整数的加减乘除。

    编程练习 使用JS完成一个简单的计算器功能.实现2个输入框中输入整数后,点击第三个输入框能给出2个整数的加减乘除. 提示:获取元素的值设置和获取方法为:例:赋值:document.getElement ...

  2. python实现简单的计算器功能

    如想实现一个计算器的功能,输入格式为字符串,不能运用python里面的内置方法,出去简单的加减乘除,设计一个相对高级的计算器: a = '1 - 2 * ( ( 6 0 -3 0 +(-40/5) * ...

  3. 用python的正则表达式实现简单的计算器功能

    #!/usr/bin/env python # -*- coding:utf-8 -*- import sys import re def welcome_func(): ""&q ...

  4. python模块——re模块(简单的计算器功能实现_eval版)

    #!/usr/bin/env python # -*- coding:utf-8 -*- __author__ = "loki" # Usage: Make a Diy Calcu ...

  5. js小功能3:一个简单的计算器功能

    html: <input type='text' id='txt1' /> <select id='select'> <option value='+'>+< ...

  6. JS实现一个简单的计算器

    使用JS完成一个简单的计算器功能.实现2个输入框中输入整数后,点击第三个输入框能给出2个整数的加减乘除.效果如上: 第一步: 创建构建运算函数count(). 第二步: 获取两个输入框中的值和获取选择 ...

  7. 完成一段简单的Python程序,用于实现一个简单的加减乘除计算器功能

    #!/bin/usr/env python#coding=utf-8'''完成一段简单的Python程序,用于实现一个简单的加减乘除计算器功能'''try: a=int(raw_input(" ...

  8. javaWeb 使用 jsp 和 javaBean 实现计算器功能

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"% ...

  9. 从0到1:使用Caliburn.Micro(WPF和MVVM)开发简单的计算器

    从0到1:使用Caliburn.Micro(WPF和MVVM)开发简单的计算器 之前时间一直在使用Caliburn.Micro这种应用了MVVM模式的WPF框架做开发,是时候总结一下了. Calibu ...

随机推荐

  1. java使用Redis6--sentinel单点故障主从自动切换

    Redis SentinelSentinel(哨兵)是用于监控redis集群中Master状态的工具,其已经被集成在redis2.4+的版本中 一.Sentinel作用:1):Master状态检测 2 ...

  2. 关于iframe切换的问题

    定位不到元素的另一种问题是有这种iframe,所有我们需要切换到该页面中去 1.首先找到这个iframe的位置,像上图有id属性我们直接  iframe = driver.find_element_b ...

  3. 如何使用robots禁止各大搜索引擎爬虫爬取网站

    ps:由于公司网站配置的测试环境被百度爬虫抓取,干扰了线上正常环境的使用,刚好看到每次搜索淘宝时,都会有一句由于robots.txt文件存在限制指令无法提供内容描述,于是便去学习了一波 1.原来一般来 ...

  4. Hyper-V如何新建虚拟机

    http://www.xitongtiandi.net/wenzhang/soft/24543.html

  5. (Lua) C++ 呼叫 Lua 的變數、函式

    簡單的在C++裡頭與Lua交互操作 首先提供 Lua 的簡單範例 print(" Lua 2019/01/07 !!!") -- Variable monster_type = & ...

  6. asp.net图片上传代码

    前端: <form action="/ImageUpload.ashx" method="post" enctype="multipart/fo ...

  7. TX2 i2c-tools使用

    安装: apt-get install libi2c-dev i2c-tools 检测i2c总线数目 用i2cdetect检测有几组i2c总线在系统上: i2cdetect -l 可以看到系统中有9组 ...

  8. leetcode python找不同

    给两个字符串,第二个字符串是第一个字符串乱序后再随机插入一个字母在随机的位置,需要我们找到这个字母 输入: s = "abcd" t = "abcde" 输出: ...

  9. 问题 K: 周期串plus

    问题 K: 周期串plus 时间限制: 1 Sec  内存限制: 128 MB提交: 682  解决: 237[提交] [状态] [命题人:外部导入] 题目描述 如果一个字符串可以由某个长度为k的字符 ...

  10. Linus' Law

    Given enough eyeballs, all bugs are shallow.                                               ------埃里克 ...