JS实现的简单计算器

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title>计算器</title>
 6     </head>
 7     <body>
 8         <input type="text" name="" id="a" placeholder="请输入一个数" />
 9         <select name=""id="b">
10             <option value="1">+</option>
11             <option value="2">-</option>
12             <option value="3">*</option>
13             <option value="4">/</option>
14             <option value="5">%</option>
15         </select>
16         <input type="text" id="c" placeholder="请输入一个数" //>
17         =<input type="text" id="p"/>
18         <input type="button" id="d" value="计算" />
19         <script type="text/javascript">
20                 var e=document.getElementById(‘d‘);
21                 e.onclick = function(aaa){
22                 var m = document.getElementById(‘a‘).value;
23                 var x = document.getElementById(‘b‘).value;
24                 var n = document.getElementById(‘c‘).value;
25                 var y = document.getElementById(‘p‘);
26 //                alert(m);
27 //                alert(x);
28 //                alert(n);
29                 if(Number(x)==1){
30                      y.value=Number(m)+Number(n);
31                 }
32                 else if(Number(x)==2){
33                     y.value=Number(m)-Number(n);
34                 }
35                 else if(Number(x)==3){
36                     y.value=Number(m)*Number(n);
37                 }
38                 else if(Number(x)==4){
39                     y.value=Number(m)/Number(n);
40                 }
41                 else if(Number(x)==5){
42                     y.value=Number(m)%Number(n);
43                 }
44                 }
45         </script>
46     </body>
47 </html>
时间: 2024-11-05 06:59:01

JS实现的简单计算器的相关文章

JS+CSS+HTML简单计算器

<!doctype html> <html> <head> <title>计算器</title> <meta charset="utf-8"> <script type="text/javascript"> //参数e用来接收传入的event事件 function cal(e){ //1.获取事件源,只处理button事件 //浏览器兼容性 var obj=e.srcElement

js实现一个简单计算器

代码如下,仅支持webkit <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>calc</title> <style type="text/css"> *{ padding:0; margin:1px; } #calculater{ margin: auto; margin-top: 30px; border: s

JS实现一个简单的计算器

使用JS完成一个简单的计算器功能.实现2个输入框中输入整数后,点击第三个输入框能给出2个整数的加减乘除.效果如上: 第一步: 创建构建运算函数count(). 第二步: 获取两个输入框中的值和获取选择框的值. 提示:document.getElementById( id名 ).value 获取或设置 id名的值. 第三步: 获取通过下拉框来选择的值来改变加减乘除的运算法则. 提示:使用switch判断运算法则. 第四步:  通过 = 按钮来调用创建的函数,得到结果. 注意: 使用parseInt

使用JS完成一个简单的计算器功能

使用JS完成一个简单的计算器功能.实现2个输入框中输入整数后,点击第三个输入框能给出2个整数的加减乘除. 提示:获取元素的值设置和获取方法为:例:赋值:document.getElementById("id").value = 1: 取值:var = document.getElementById("id").value: 任务 第一步: 创建构建运算函数count(). 第二步: 获取两个输入框中的值和获取选择框的值. 提示:document.getElement

Javascript 实现简单计算器实例代码

Javascript 实现简单计算器实例代码 这篇文章主要介绍了Javascript 实现简单计算器实例代码的相关资料,需要的朋友可以参考下 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63

用javascript编写的简单计算器

老师布置的任务,弄了一天,总算把代码搞出来了,作为菜鸟给自己一点小掌声,传说中JS是很简单的,但是要写出一个程序真的很需要锻炼,我的锻炼实在是太少了,天天DOTA中.呵呵(做了些小注释)大家应该能看懂吧(没注释的程序我不喜欢) 希望看过的人给点建议.另外eval_r改为eval,共4处(不知道为什么保存后会出现这种情况) <html><head><title>网页计算器byWillikan</title>  <meta name="Willi

JS实现简易的计算器

JS可以做的事多了,那就用来实现一个计算器吧 看看手机中的计算器,分为普通计算器和科学计算器     自认脑袋不够大,就实现一个普通版本的吧(支持正负数加减乘除等基本连续的运算,未提供括号功能) 看看图示效果, 或 在线演示 一.知识准备 1+1 = ? 正常来说,我们看到这个表达式都知道怎么运算,知道运算结果 但计算机不一样,计算机无法识别出这串表达式,它只能识别特定的规则:前缀表达式+ 1 1 或后缀表达式1 1 + 举个栗子 (3 + 4) × 5 - 6 就是中缀表达式- × + 3 4

JS做一个四则运算计算器

用JS做一个简单的网页计算器如上图所示,只进行简单的加减乘除运算 <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>计数器</title></head><body>    <input type="text" name="text"

j2ee-JSP之简单计算器

来源韩顺平.j2ee视频实战教程jsp第1讲(下集) -------------------------------------------------------------------------------------------------------- 简单计算器,可以控制输入的数(仅第一个数)不能为空且不能为字符串 myCal.jsp代码 1 <!--这是计算器的界面 --> 2 <!-- 可以控制输入的数不能为空且不能为字符串 --> 3 <%@ page co