如何用jsp实现一个简易计算器(三)

做这个jsp页面,主要是为了实现在同一个页面提交和接受数据的功能

这个小程序存在很多不足,希望大家多多批评指正。

<%@ page language="java" contentType="text/html;" pageEncoding="gbk"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk">
<title>my simple calculate</title>

<script type="text/javascript" >
	// 输入判断,要求必须是数字格式
	function check_num() {
		var re = /^[0-9,]*$/;
		
		if((!(new RegExp("\\S+")).test(document.getElementById("number1").value))&&(!(new RegExp("\\S+")).test(document.getElementById("number2").value))){
			alert("请输入数一、数二!");
			document.getElementById("number1").focus();
			return false;
		}else if(!(new RegExp("\\S+")).test(document.getElementById("number1").value)){
			alert("请输入数一!");
			document.getElementById("number1").focus();
			return false;
		}else if(!(new RegExp("\\S+")).test(document.getElementById("number2").value)){
			alert("请输入数二!");
			document.getElementById("number2").focus();
			return false;
		}
		
		if ((!re.test(document.getElementById("number1").value))
				&& (!re.test(document.getElementById("number2").value))) {
			alert("数一、数二都不是数字,请输入数字!");
			document.getElementById("number1").focus();
			return false;
		} else if (!re.test(document.getElementById("number1").value)) {
			alert("数一不是数字,请输入数字!");
			document.getElementById("number1").focus();
			return false;
		} else if (!re.test(document.getElementById("number2").value)) {
			alert("数二不是数字,请输入数字!");
			document.getElementById("number2").focus();
			return false;
		}
		document.form1.submit();
		return true;
	}
</script>

</head>
<body>
	<%
		// 获取输入框输入的数一、数二
		String numString1 = request.getParameter("number1");
		String flagString = request.getParameter("flag");
		String numString2 = request.getParameter("number2");

		int num1 = 0;
		int num2 = 0;
		int result = 0;
		boolean flag = false;
		// 判断输入值是否为空,不为空,根据不同符号进行计算
		if (numString1 != null && numString2 != null) {
			num1 = Integer.parseInt(numString1);
			num2 = Integer.parseInt(numString2);
			flag = true;
			if (flagString.equals("+")) {
				result = num1 + num2;
			} else if (flagString.equals("-")) {
				result = num1 - num2;
			} else if (flagString.equals("*")) {
				result = num1 * num2;
			} else {
				result = num1 / num2;
			}
		}
	%>
	<div style="padding: 10px; margin: 15px auto; width: 170px; height: 280px; border: 2px solid #ccc; background-color:#ccc;">
		<h4 align="center">简易计算器</h4>
		<hr>
		<form name="form1" action="compute.jsp" method="get">
			数一: <input type="text" id="number1" name="number1" value="" size="15">
			<br>
			<div style="position: relative; height: 15px; margin-top: 10px;" align="left">
				<select name="flag">
					<option value=+>+</option>
					<option value=->-</option>
					<option value=*>*</option>
					<option value= />/
					</option>
				</select>
			</div>
			<br>
			数二: <input type="text" id="number2" name="number2" value="" size="15">
			<br> 
			<br> 
			<input type="button" name="button1" value="计算" onclick="check_num()">
		</form>

		<br> 计算结果:
		<%
			if (flag)
				out.println(result);
			flag = false;
		%>
	</div>
</body>
</html>


实现效果如下:


郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。