先来看一个Ajax例子
代码如下:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<input type="button" value="Ajax提交" onclick="Ajax();" />
<div id="resText"></div>
</body>
<script type="text/javascript">
function Ajax() {
var xmlHttpReq = null;//声明一个空对象用来装入XMLHttpRequest对象
if(window.ActiveXObject) {
xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");//IE5 IE6是以ActiveXObject的方式引入XMLHttpRequest的
} else if(window.XMLHttpRequest) {//除IE5 IE6 以外的浏览器XMLHttpRequest是window的子对象
xmlHttpReq = new XMLHttpRequest();//实例化一个XMLHttpRequest对象
}
if(xmlHttpReq != null) {
xmlHttpReq.open("GET", "test.jsp", true);//调用open()方法并采用异步方式
xmlHttpReq.onreadystatechange = RequestCallBack;//设置回调函数
xmlHttpReq.send(null);//因为使用get方式提交,所以可以使用null参调用
}
function RequestCallBack() {//一旦readyState值改变,将会调用这个函数}
if(xmlHttpReq.readyState == 4) {
if(xmlHttpReq.status == 200) {
//将xmlHttpReq.responseText的值赋予id为resText的元素
document.getElementById("resText").innerHTML = xmlHttpReq.responseText;
}
}
}
}
</script>
</html>
test.jsp的内容:
代码如下:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%out.println("Hello Ajax!");%>
下面来看下jQuery中的Ajax
新闻热点
疑难解答
图片精选