TA的每日心情 | 开心 2021-3-12 23:18 |
---|
签到天数: 2 天 [LV.1]初来乍到
|
- 运行图:
- [img]http://img.javaxxz.com/2014/10/13/045417937.gif[/img]
- 一、处理请求的jsp
- <%@ page contentType="text/html; charset=gb2312"%>
- <%
- String number_1 = request.getParameter("number_1");
- String number_2 = request.getParameter("number_2");
- int num_1=0,num_2=0;
- boolean status = true;
- if(number_1!=null) {
- try {
- num_1 = Integer.parseInt(number_1);
- }catch(Exception ex) {
- status = false;
- out.println("Error,乘数必须是整数。");
- }
- }
- if(number_2!=null) {
- try {
- num_2 = Integer.parseInt(number_2);
- }catch(Exception ex) {
- status = false;
- out.println("Error,被乘数必须是整数。");
- }
- }
- if(status) out.println(num_1*num_2);
- %>
-
复制代码
二、发送AJAX请求的HTML网页 <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>Ch03--一个简单的例子</title>
<link href="../css/style.css" rel="stylesheet" type="text/css">
<script language="javascript">
- //按钮“开始计算”响应函数,判断输入域情况后调用send_request函数。
- function doCaculate() {
- var f = document.form1;
- if((f.number_1.value!="")&&(f.number_2.value!="")) {
- //在响应返回以前,输出提示信息
- document.getElementById("feedback").innerHTML = "正在计算,请稍后......";
- send_request("process.jsp?number_1="+f.number_1.value+"&number_2="+f.number_2.value);
- }
- else if(f.number_1.value=="") document.getElementById("feedback").innerHTML = "乘数不能为空。";
- else if(f.number_2.value=="") document.getElementById("feedback").innerHTML = "被乘数不能为空。";
- }
- var http_request = false;
- //向服务器发起XMLHTTP请求。
- function send_request(url) {//初始化、指定处理函数、发送请求的函数
- http_request = false;
- //开始初始化XMLHttpRequest对象
- if(window.XMLHttpRequest) { //Mozilla 浏览器
- http_request = new XMLHttpRequest();
- if (http_request.overrideMimeType) {//设置MiME类别
- http_request.overrideMimeType("text/xml");
- }
- }
- else if (window.ActiveXObject) { // IE浏览器
- try {
- http_request = new ActiveXObject("Msxml2.XMLHTTP");
- } catch (e) {
- try {
- http_request = new ActiveXObject("Microsoft.XMLHTTP");
- } catch (e) {}
- }
- }
- if (!http_request) { // 异常,创建对象实例失败
- window.alert("不能创建XMLHttpRequest对象实例.");
- return false;
- }
- http_request.onreadystatechange = processRequest;
- // 确定发送请求的方式和URL以及是否同步执行下段代码
- http_request.open("GET", url, true);
- http_request.send(null);
- }
- // 处理返回信息的函数
- function processRequest() {
- var f = document.form1;
- if (http_request.readyState == 4) { // 判断对象状态
- if (http_request.status == 200) { // 信息已经成功返回,开始处理信息
- var returnStr = http_request.responseText;
- if(returnStr.indexOf("Error")==-1) {
- f.result.value = returnStr;
- //响应返回后清空提示信息
- document.getElementById("feedback").innerHTML = "";
- }
- else {
- f.result.value = "";
- document.getElementById("feedback").innerHTML = returnStr;
- }
- } else { //页面不正常
- alert("您所请求的页面有异常。");
- }
- }
- }
复制代码 </script>
</head> <body><center>
<form action="process.jsp" method="post" enctype="application/x-www-form-urlencoded" name="form1" target="_self">
<table width="400" cellpadding="4" cellspacing="1" border="0">
<caption>简单乘法计算</caption>
<tr>
<td align="center">
<input type="text" name="number_1" size="10"> *<input type="text" name="number_2" size="10"> =
<input type="text" name="result" size="10">
</td>
</tr>
<tr align="center">
<td>
<input type="button" name="Caculate" value="开始计算" onClick="doCaculate()">
<input type="reset" name="reset" value="重新计算">
</td>
</tr>
<tr><td align="center" height="25"><label id="feedback"> </label></td></tr>
</table>
</form>
</center>
</body>
</html>
源码下载:http://file.javaxxz.com/2014/10/13/045418015.zip |
|