//放在ajax.jsp中
<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%><html> <head> <title>ajax</title> </head><script type="text/javascript">var http_request = false;//此函数为框架函数,method为发送方式。url未处理页面。content为发送内容。responseType为处理类型。callback为处理函数。function send_request(method,url,content,responseType,callback) { http_request = false; //初始化http_request,使其适应各种浏览器 if(window.XMLHttpRequest) { http_request = new XMLHttpRequest(); if (http_request.overrideMimeType) { http_request.overrideMimeType("text/xml"); } } else if (window.ActiveXObject) { 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; } //根据返回类型,选择处理函数 if(responseType.toLowerCase()=="text") { http_request.onreadystatechange = function (){ if (http_request.readyState == 4) { // 判断对象状态 if (http_request.status == 200) { // callback(http_request.responseText); } else { //页面不正常 alert(" 请求的页面有异常"); } } } } else if(responseType.toLowerCase()=="xml") { http_request.onreadystatechange = function (){ if (http_request.readyState == 4) { // 判断对象状态 if (http_request.status == 200) { // callback(http_request.responseText); } else { //页面不正常 alert(" 请求的页面有异常"); } } } } else { window.alert("响应类别参数错误"); return false; } //确定发送请求方式和URL以及是否异步执行下列代码 if(method.toLowerCase()=="get") { http_request.open(method, url, true);//true表示异步执行 } else if(method.toLowerCase()=="post") { http_request.open(method, url, true); http_request.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); } else { window.alert("http请求类别参数错误"); return false; } //如果为post,会发送content内容。如果为get,这会发送null http_request.send(content);}//此函数为点击button触动的函数,通过调用框架函数完成功能。function send(){ var name=document.getElementById("name").value; send_request('POST','index.jsp','name='+name,'text',handler);
// send_request('GET','index.jsp',null,'text',handler);
}//此函数为处理函数function handler(o){ window.alert(o);} </script> <body> <input type="text" id="name" name="name"/> <input type="button" value="提交" οnclick="send()"/> <br/> <div id="show" name="show"></div> </body></html>
//放在index.jsp中
<html>
<head>
<title></title>
</head>
<body>
<%
out.println("姓名为:"+request.getParameter("name"));
%>
</body>
</html>
蓝色部分为 ajax 框架部分,红色部分为框架的使用,例子是 post 方法。
