📄 9-6.html

📁 文件是《精通Javascript+jQuery》的书中实例

💻 HTML

字号:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>多个异步对象</title>
<script language="javascript">	
function createQueryString(oText){
	var sInput = document.getElementById(oText).value;
	var queryString = "oText=" + sInput;
	return queryString;
}
function getData(oServer, oText, oSpan){
	var xmlHttp;	//处理为局部变量
	if(window.ActiveXObject)
		xmlHttp = new ActiveXObject("Microsoft.XMLHttp");
	else if(window.XMLHttpRequest)
		xmlHttp = new XMLHttpRequest();
	var queryString = oServer + "?";
	queryString += createQueryString(oText) + "&timestamp=" + new Date().getTime();
	xmlHttp.onreadystatechange = function(){
		if(xmlHttp.readyState == 4 && xmlHttp.status == 200){
			var responseSpan = document.getElementById(oSpan);
			responseSpan.innerHTML = xmlHttp.responseText;
			delete xmlHttp;		//收到返回结构后手动删除
			xmlHttp = null;
		}
	}
	xmlHttp.open("GET",queryString);
	xmlHttp.send(null);
}
function test(){
	//同时发送两个不同的异步请求
	getData('9-5.aspx','first','firstSpan');
	getData('9-5.aspx','second','secondSpan');
}
</script>
</head>

<body>
<form>
	first: <input type="text" id="first">
	<span id="firstSpan"></span>
<br>
	second: <input type="text" id="second">
	<span id="secondSpan"></span>
<br>
	<input type="button" value="发送" onclick="test()">
</form>
</body>
</html>

⌨️ 快捷键说明

复制代码 Ctrl + C

搜索代码 Ctrl + F

全屏模式 F11

切换主题 Ctrl + Shift + D

显示快捷键 ?

增大字号 Ctrl + =

减小字号 Ctrl + -