JS制作计算器

最新推荐文章于 2022-05-18 13:15:33 发布

自豪听我的

最新推荐文章于 2022-05-18 13:15:33 发布

阅读量119

点赞数

分类专栏： js监听事件文章标签： js

本文链接：https://blog.csdn.net/xYY_X_xYY/article/details/116464387

版权

js监听事件专栏收录该内容

4 篇文章 0 订阅

订阅专栏

使用onblur事件监听输入框失去焦点获取输入框值，使用onchange事件监听下拉框，获取运算方法

<!DOCTYPE html>
<html>

<head>
    <title></title>
</head>

<body>
    <input type='text' id='num1' />
    <select id='operate'>
        <option value='+'>+</option>
        <option value="-">-</option>
        <option value="*">*</option>
        <option value="/">/</option>
    </select>
    <input type='text' id='num2' />
	    <input type='button' value=' = ' id="btn" />
	    <input type='text' id='result' />
		<script type="text/javascript">
			var result = document.getElementById('result');
			var btn = document.getElementById('btn');
			var num1=document.getElementById('num1');
			var num2 = document.getElementById('num2');
			num1.onblur = function(){
				num1 = document.getElementById('num1');
				num1 = num1.value;
			}
			num2.onblur = function(){
				num2 = document.getElementById('num2');
				num2=num2.value;
			}		
			var operate = document.getElementById('operate');
			var way = operate.value;
			operate.onchange = function(){
				way = operate.value;
				console.log(way);
			
			}
			
			btn.onclick = function(){
				
				if(way=='+'){
					result.value=num1+num2;
				}else if(way=='-'){
					result.value = num1-num2;
				}else if(way=='*'){
					result.value = num1*num2;
				}else{
					result.value = num1/num2;
				}
			}
		
		</script>
	</body>
	
	</html>

在这里插入图片描述

自豪听我的

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS制作计算器

使用onblur事件监听输入框失去焦点获取输入框值，使用onchange事件监听下拉框，获取运算方法<!DOCTYPE html><html><head> <title></title></head><body> <input type='text' id='num1' /> <select id='operate'> <option val
复制链接

扫一扫

专栏目录