<script type="text/javascript" src="js/jquery-1.6.4.js"></script>
<script type="text/javascript">
function test(){
/*
readyState 存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。
0: 请求未初始化
1: 服务器连接已建立
2: 请求已接收
3: 请求处理中
4: 请求已完成,且响应已就绪
status 200: "OK"
404: 未找到页面
*/
//获取id为testid的值
var val = document.getElementById("textid").value;
var xmlhttp;
if(window.XMLHttpRequest){
//创建 XMLHttpRequest 对象
xmlhttp = new XMLHttpRequest();
} else
{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function(){
if(xmlhttp.readyState==4 && xmlhttp.status==200){
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
//servlet/testAjax 服务器路径
xmlhttp.open("GET","<%=basePath%>servlet/testAjax?name="+val,true);
xmlhttp.send();
}
function test1(){
$.ajax(
{url:"<%=basePath%>servlet/testAjax",
type:"GET",
data:{"name":$("#textid").val()},
dataType:"text",
success:function(data){
$("#myDiv").html(data);
},
error:function(){
alert("request error");
}
}
);
}
</script>
服务器端代码:
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String str =request.getParameter("name");
PrintWriter pw = response.getWriter();
pw.print("name:"+str);
pw.flush();
pw.close();
}
html 代码:
<body>
<form action="servlet/testAjax">
<input type="text" value="" id="textid"/> <br/>
<div id="myDiv"></div>
<input type="button" value="ajax" οnclick="test1()">
</form>
</body>