用javascript做一个计算器,javascript简单计算器

gpt886

于 2023-11-26 00:20:21 发布

阅读量95

点赞数

文章标签： udp

本文链接：https://blog.csdn.net/2301_79533350/article/details/134622924

版权

本文详细介绍了如何使用JavaScript编写一个基础的网页计算器，包括获取用户输入、处理运算符选择、验证输入内容和处理除数为零的情况。

摘要由CSDN通过智能技术生成

大家好，本文将围绕怎么用javascript做一个简单的计算器展开说明，如何用js实现一个简单的计算器是一个很多人都想弄明白的事情，想搞清楚javascript计算数字和的方法需要先了解以下几个事情。

代码

<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title>简易计算器</title>
		<style type="text/css">
			body {
				text-align: center;
			}
		</style>
	</head>

	<body>
		<h1>简易计算器</h1>
		<input type="text" id="one" placeholder="请输入第一个数" /><br />
		<select id="choice">
			<option value="default">请选择运算符</option>
			<option value="+">+</option>
			<option value="-">-</option>
			<option value="*">*</option>
			<option value="/">/</option>
		</select><br />
		<input type="text" id="two" placeholder="请输入第二个数" /><br />
		<input type="button" value="计算" onclick="count()" /><br />
		<span>计算结果:</span><span id="show"></span>

		< type="text/java">
			function count() {
				//获取文本框输入的数字
				var num1 = document.getElementById("one").value;
				var num2 = document.getElementById("two").value;
				//获取下拉框选取的内容
				var choiceID = document.getElementById("choice");
				var index = choiceID.selectedIndex;
				var choiceText = choiceID.options[index].value;
				//判断输入内容是否为数字
				var isNum = isNaN(num1) || isNaN(num2);
				//定义计算条件
				var isAddition = (choiceText == "+" && !isNum); //加法
				var isSubtraction = (choiceText == "-" && !isNum); //减法
				var isMultiplication = (choiceText == "*" && !isNum); //乘法
				var isDivision = (choiceText == "/" && !isNum); //除法
				var isChoice = (choiceText == "default");
				//判断操作
				if(isNum) {
					//如果输入的不是数字，弹出提示
					alert("请输入数字！");
				} else if(isChoice) {
					//如果没有选择运算符，弹出提示
					alert("请选择运算符！");
				} else if(isAddition) {
					var sum = Number(num1) + Number(num2);
					document.getElementById("show").innerText = sum; //写入到id为show的节点中
				} else if(isSubtraction) {
					var sum = Number(num1) - Number(num2);
					document.getElementById("show").innerText = sum; //写入到id为show的节点中
				} else if(isMultiplication) {
					var sum = Number(num1) * Number(num2);
					document.getElementById("show").innerText = sum; //写入到id为show的节点中
				} else if(isDivision) {
					if(num2 == 0) {
						//除数不能为0
						alert("除数不能为0！");
					} else {
						var sum = Number(num1) / Number(num2);
						document.getElementById("show").innerText = sum; //写入到id为show的节点中
					}
				}
			}
		</>
	</body>

</html>