编程练习

使用JS完成一个简单的计算器功能。实现2个输入框中输入整数后，点击第三个输入框能给出2个整数的加减乘除。

提示：获取元素的值设置和获取方法为：例：赋值：document.getElementById(“id”）.value = 1； 取值：var = document.getElementById(“id”）.value；

任务

第一步： 创建构建运算函数count()。

第二步： 获取两个输入框中的值和获取选择框的值。

提示：document.getElementById( id名 ).value 获取或设置 id名的值。

第三步： 获取通过下拉框来选择的值来改变加减乘除的运算法则。

提示：使用switch判断运算法则。

第四步：  通过 = 按钮来调用创建的函数，得到结果。

注意: 使用parseInt()函数可解析一个字符串,并返回一个整数。

<!DOCTYPE html>

<html>

 <head>

 <meta charset="utf-8">

 <title></title>

 <script type="text/javascript">

  function count(){

		var a = parseInt(document.getElementById("tex1").value);

		var b = parseInt(document.getElementById("tex2").value);

		var selectSign = document.getElementById("select").value;

		switch (selectSign)

		{

		case '+': answer = a+b;break;

		case '-': answer = a-b;break;

		case '*': answer = a*b;break;

		case '/': answer = a/b;

		}

		document.getElementById("fruit").value = answer;

  }

 </script>

 </head>

<body>

  <input type="text" id="tex1" />

  <select id="select">

		<option value="+">+</option>

		<option value="-">-</option>

		<option value="*">*</option>

		<option value="/">/</option>

  </select>

  <input type="text" id="tex2" />

  <input type="button" value=" = " onclick="count()" />

  <input type="text" id="fruit" onclick="count()" />

</body>

</html>

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

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

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

  2. Android下实现一个简单的计算器源码

    下面的内容是关于Android下实现一个简单的计算器的内容. import android.app.Activity; import android.os.Bundle;import android. ...

  3. JS规则 编程练习 考考大家的数学，计算以下计算公式的结果。然后在浏览器中运行一下，看看结果是否跟你的结果一致。

    编程练习 考考大家的数学,计算以下计算公式的结果.然后在浏览器中运行一下,看看结果是否跟你的结果一致. 任务 第一步: 在  ? 处填写你的答案. 第二步: 填写完成后,运行一下,看看是不是跟你填写的 ...

  4. 原生js实现一个简单的倒计时功能

    大家好,我是云中君!欢迎大家来观看我的博客 之前那,在群里看到很多人问,关于电商网站中的倒计时功能怎么实现,很多人说在网上找了很多插件,但是不是很会用,所以今天就在这里分享一下我封装的一个小的倒计时功 ...

  5. 用JavaScript写一个简单的计算器

    本文使用js实现了一个简单的加.减.乘.除计算器. 以下是css部分代码: *{ padding:0; margin:0; color: #424242; } .outer{ width:300px; ...

  6. Python高级编程之生成器(Generator)与coroutine(四):一个简单的多任务系统

    啊,终于要把这一个系列写完整了,好高兴啊 在前面的三篇文章中介绍了Python的Python的Generator和coroutine(协程)相关的编程技术,接下来这篇文章会用Python的corout ...

  7. WinForm 制作一个简单的计算器

    namespace WindowsFormsApplication6 { public partial class Form1 : Form { //存储上次点击了什么按钮,0代表什么都没有点击,1代 ...

  8. 使用qt制作一个简单的计算器

    前言:今天使用qt制作了一个很简单的计算器,觉得挺有意思的,所以在这里跟大家分享一下. 这里先跟大家说说使用到的函数: 一.槽连接函数 connect(信号发送者,发送的信号,信号接收者,信号接收者的 ...

  9. js利用点击事件做一个简单的计算器

    先放一个样式图: 源代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"&g ...

随机推荐

  1. 剑指offer——55两个链表的第一个公共节点

    题目描述 输入两个链表,找出它们的第一个公共结点. 题解: 分别遍历两个链表到链尾,并计算其长度,若最后一个节点相同,则存在公共节点 然后让长链表指针从头先移动长度差个节点,然后两个链表指针一起移动, ...

  2. C# WinfForm 控件之dev电子表格 SpreadSheet

    网上找了一些资料可是不得入门 只能再回过头来看demos 看了一点 例子大多继承自SpreadsheetRibbonTutorialControlBase 这个类,它又继承自SpreadSheetTu ...

  3. hdu6354 /// 线段树

    题目大意: 给定n m x y z 长度为n的序列初始为0 接下来m个操作 l r v 将l r区间内比v小的数都变成v l r v由x y z和给定的函数生成 线段树维护区间 最大值 最小值 再加 ...

  4. hdu6315 /// 线段树区间更新

    题目大意: 给定n q 为序列的个数和操作的个数 给定n个数的序列b[]作为分母 初始全为0的序列a[]作为分子 两种操作 add l r 为a[]的l到r区间全部+1 query l r 为查询l到 ...

  5. css垂直居中设置

    转载自大佬的文章:纯css实现垂直居中的几种方法(https://www.cnblogs.com/hutuzhu/p/4450850.html) 总结得很棒,有好几种方法自己没用过的,拷贝过来给自己看 ...

  6. 笔记：TCP/IP基础知识

    TCP/IP是指利用IP进行通信时必须用到的协议群的统称. 互联网层(网络层) IP IP是跨越网络传送数据包,使整个网络都能收到数据的协议.IP地址在发送数据的时候作为主机的标识. ICMP 用来诊 ...

  7. 【胡策篇】题解 (UOJ 192 + CF938G + SPOJ DIVCNT2)

    和泉纱雾与烟花大会 题目来源: UOJ 192 最强跳蚤 (只改了数据范围) 官方题解: 在这里哦~(说的很详细了 我都没啥好说的了) 题目大意: 求树上各边权乘积是完全平方数的路径数量. 这种从\( ...

  8. one-hot encoding与哑变量的区别

    one-hot encoding与哑变量的区别 one-hot比哑变量的特征位多一位,即哑变量是精简版的one-hot,即在线性回归中用截距项来表示最后一维,但由于最初很难分辨特征的主次关系,且机器学 ...

  9. 利用字节流文件生成包含多文件的zip文件

    InputStream[] inputStreamsList = new InputStream[jsonArr.size()]; String[] fileNameList = new String ...

  10. jq-demo-拖拽

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