基本示例一：
前臺頁面：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
function ajaxFunction() {
var xmlHttp;
try {
xmlHttp = new XMLHttpRequest(); // Firefox, Opera 8.0+, Safari
}
catch (e) {
// Internet Explorer
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); //Internet Explorer 6.0+
}
catch (e) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); // Internet Explorer 5.5+
}
catch (e) {
alert("您的瀏覽器不支持AJAX！");
return false;
}
}
}
xmlHttp.onreadystatechange = function() {
//0 請求未初始化（在調用 open() 之前）
//1 請求已提出（調用 send() 之前）
//2 請求已發送（這裏通常可以從響應得到內容頭部）
//3 請求處理中（響應中通常有部分數據可用，但是服務器還沒有完成響應）
//4 請求已完成（可以訪問服務器響應並使用它）
if (xmlHttp.readyState == 4) {
if (xmlHttp.status == 200) {
//可以通過 responseText 屬性來取回由服務器返回的數據
document.getElementById("name2").value = xmlHttp.responseText;
}
}
}
var s = document.getElementById("name1").value;
xmlHttp.open("GET", "time.aspx?s=" + s, true);
//send() 方法可將請求送往服務器
xmlHttp.send(null);
}
</script>
</head>
<body>
用戶：<input type="text" id="name1" οnblur="ajaxFunction()" />
時間：<input type="text" id="name2" />
</body>
</html>
後臺代碼：
Time.aspx
if (!IsPostBack)
{
if (Request.QueryString["s"] == "admin")
{
Response.Write("用戶名已存在");
}
else
{
Response.Write("可以註冊！");
}
}GetHeader.html
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
var xmlHttp;
function loadDoc(url) {
xmlHttp = null;
if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
else if (window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
if (xmlHttp != null) {
xmlHttp.onreadystatechange = state_Change;
xmlHttp.open("GET", url, true);
xmlHttp.send(null);
}
else {
alert("瀏覽器不支持Ajax");
}
}
function state_Change() {
if (xmlHttp.readyState == 4) {
if (xmlHttp.status == 200) {
document.getElementById("p1").innerHTML = xmlHttp.getAllResponseHeaders();
}
else {
alert(xmlHttp.statusText);
}
}
}
</script>
</head>
<body>
<p id="p1">
The getAllResponseHeaders() function returns the headers of a resource. The headers
contain file information like length, server-type, content-type, date-modified,
etc.</p>
<button οnclick="loadDoc('a.txt')">
Get Headers</button>
</body>
</html>加載文本:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
var xmlHttp = null;
function loadXML(url) {
if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
// code for Firefox, Opera, IE7, etc.
}
else if (window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
if (xmlHttp != null) {
xmlHttp.onreadystatechange = state_Change;
xmlHttp.open("GET", url, true);
xmlHttp.send(null);
}
else {
alert("Your browser does not support XMLHttp");
}
}
function state_Change() {
if (xmlHttp.readyState == 4) {
if (xmlHttp.status == 200) {
document.getElementById("T1").innerHTML = xmlHttp.responseText;
}
else {
alert(xmlHttp.statusText);
}
}
}
</script>
</head>
<body οnlοad="loadXML('a.txt')">
<div id="T1" style="border: 1px solid black; height: 40; width: 300; padding: 5">
</div>
<br />
<button οnclick="loadXML('b.txt')">
Click</button>
</body>
</html>
獲取狀態值：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
var xmlHttp;
function loadXml(url) {
xmlHttp = null;
if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
else if (window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
if (xmlHttp != null) {
xmlHttp.onreadystatechange = state_Change;
xmlHttp.open("GET", url, true);
xmlHttp.send(null);
}
else {
alert("不支持Xmlhttp");
}
}
function state_Change() {
if (xmlHttp.readyState == 4) {
if (xmlHttp.status == 200) {
document.getElementById("A1").innerHTML = xmlHttp.status;
document.getElementById("A2").innerHTML = xmlHttp.statusText;
document.getElementById("A3").innerHTML = xmlHttp.responseText;
}
else {
alert(xmlHttp.statusText);
}
}
}
</script>
</head>
<body>
<h2>
Using the HttpRequest Object</h2>
<p>
<b>Status:</b> <span id="A1"></span>
</p>
<p>
<b>Status text:</b> <span id="A2"></span>
</p>
<p>
<b>Response:</b>
<span id="A3"></span>
</p>
<button οnclick="loadXml('node.xml')">
Get XML</button>
</body>
</html>
獲取XML信息:
xml:
<?xml version="1.0" encoding="utf-8" ?>
<CATALOG>
<CD>
<TITLE>Empire Burlesque</TITLE>
<ARTIST>Bob Dylan</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>Columbia</COMPANY>
<PRICE>10.90</PRICE>
<YEAR>1985</YEAR>
</CD>
<CD>
<TITLE>Hide your heart</TITLE>
<ARTIST>Bonnie Tyler</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>CBS Records</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1988</YEAR>
</CD>
<CD>
<TITLE>Greatest Hits</TITLE>
<ARTIST>Dolly Parton</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>RCA</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1982</YEAR>
</CD>
<CD>
<TITLE>Still got the blues</TITLE>
<ARTIST>Gary Moore</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Virgin records</COMPANY>
<PRICE>10.20</PRICE>
<YEAR>1990</YEAR>
</CD>
<CD>
<TITLE>Eros</TITLE>
<ARTIST>Eros Ramazzotti</ARTIST>
<COUNTRY>EU</COUNTRY>
<COMPANY>BMG</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1997</YEAR>
</CD>
<CD>
<TITLE>One night only</TITLE>
<ARTIST>Bee Gees</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Polydor</COMPANY>
<PRICE>10.90</PRICE>
<YEAR>1998</YEAR>
</CD>
<CD>
<TITLE>Sylvias Mother</TITLE>
<ARTIST>Dr.Hook</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>CBS</COMPANY>
<PRICE>8.10</PRICE>
<YEAR>1973</YEAR>
</CD>
<CD>
<TITLE>Maggie May</TITLE>
<ARTIST>Rod Stewart</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Pickwick</COMPANY>
<PRICE>8.50</PRICE>
<YEAR>1990</YEAR>
</CD>
<CD>
<TITLE>Romanza</TITLE>
<ARTIST>Andrea Bocelli</ARTIST>
<COUNTRY>EU</COUNTRY>
<COMPANY>Polydor</COMPANY>
<PRICE>10.80</PRICE>
<YEAR>1996</YEAR>
</CD>
<CD>
<TITLE>When a man loves a woman</TITLE>
<ARTIST>Percy Sledge</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>Atlantic</COMPANY>
<PRICE>8.70</PRICE>
<YEAR>1987</YEAR>
</CD>
<CD>
<TITLE>Black angel</TITLE>
<ARTIST>Savage Rose</ARTIST>
<COUNTRY>EU</COUNTRY>
<COMPANY>Mega</COMPANY>
<PRICE>10.90</PRICE>
<YEAR>1995</YEAR>
</CD>
<CD>
<TITLE>1999 Grammy Nominees</TITLE>
<ARTIST>Many</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>Grammy</COMPANY>
<PRICE>10.20</PRICE>
<YEAR>1999</YEAR>
</CD>
<CD>
<TITLE>For the good times</TITLE>
<ARTIST>Kenny Rogers</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Mucik Master</COMPANY>
<PRICE>8.70</PRICE>
<YEAR>1995</YEAR>
</CD>
<CD>
<TITLE>Big Willie style</TITLE>
<ARTIST>Will Smith</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>Columbia</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1997</YEAR>
</CD>
<CD>
<TITLE>Tupelo Honey</TITLE>
<ARTIST>Van Morrison</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Polydor</COMPANY>
<PRICE>8.20</PRICE>
<YEAR>1971</YEAR>
</CD>
<CD>
<TITLE>The very best of</TITLE>
<ARTIST>Cat Stevens</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Island</COMPANY>
<PRICE>8.90</PRICE>
<YEAR>1990</YEAR>
</CD>
<CD>
<TITLE>Stop</TITLE>
<ARTIST>Sam Brown</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>A and M</COMPANY>
<PRICE>8.90</PRICE>
<YEAR>1988</YEAR>
</CD>
<CD>
<TITLE>Bridge of Spies</TITLE>
<ARTIST>T'Pau</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Siren</COMPANY>
<PRICE>7.90</PRICE>
<YEAR>1987</YEAR>
</CD>
<CD>
<TITLE>Private Dancer</TITLE>
<ARTIST>Tina Turner</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Capitol</COMPANY>
<PRICE>8.90</PRICE>
<YEAR>1983</YEAR>
</CD>
<CD>
<TITLE>Midt om natten</TITLE>
<ARTIST>Kim Larsen</ARTIST>
<COUNTRY>EU</COUNTRY>
<COMPANY>Medley</COMPANY>
<PRICE>7.80</PRICE>
<YEAR>1983</YEAR>
</CD>
<CD>
<TITLE>Pavarotti Gala Concert</TITLE>
<ARTIST>Luciano Pavarotti</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>DECCA</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1991</YEAR>
</CD>
<CD>
<TITLE>The dock of the bay</TITLE>
<ARTIST>Otis Redding</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>Atlantic</COMPANY>
<PRICE>7.90</PRICE>
<YEAR>1987</YEAR>
</CD>
<CD>
<TITLE>Picture book</TITLE>
<ARTIST>Simply Red</ARTIST>
<COUNTRY>EU</COUNTRY>
<COMPANY>Elektra</COMPANY>
<PRICE>7.20</PRICE>
<YEAR>1985</YEAR>
</CD>
<CD>
<TITLE>Red</TITLE>
<ARTIST>The Communards</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>London</COMPANY>
<PRICE>7.80</PRICE>
<YEAR>1987</YEAR>
</CD>
<CD>
<TITLE>Unchain my heart</TITLE>
<ARTIST>Joe Cocker</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>EMI</COMPANY>
<PRICE>8.20</PRICE>
<YEAR>1987</YEAR>
</CD>
</CATALOG>
前臺代碼：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
var xmlhttp;
function loadXMLDoc(url) {
xmlhttp = null;
if (window.XMLHttpRequest) {// code for IE7, Firefox, Mozilla, etc.
xmlhttp = new XMLHttpRequest();
}
else if (window.ActiveXObject) {// code for IE5, IE6
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
if (xmlhttp != null) {
xmlhttp.onreadystatechange = onResponse;
xmlhttp.open("GET", url, true);
xmlhttp.send(null);
}
else {
alert("Your browser does not support XMLHTTP.");
}
}
function onResponse() {
if (xmlhttp.readyState != 4) return;
if (xmlhttp.status != 200) {
alert("Problem retrieving XML data");
return;
}
txt = "<table border='1'>";
x = xmlhttp.responseXML.documentElement.getElementsByTagName("CD");
for (i = 0; i < x.length; i++) {
txt = txt + "<tr>";
xx = x[i].getElementsByTagName("TITLE");
{
try {
txt = txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
}
catch (er) {
txt = txt + "<td> </td>";
}
}
xx = x[i].getElementsByTagName("ARTIST");
{
try {
txt = txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
}
catch (er) {
txt = txt + "<td> </td>";
}
}
txt = txt + "</tr>";
}
txt = txt + "</table>";
document.getElementById('copy').innerHTML = txt;
}
</script>
</head>
<body>
<div id="copy">
<button οnclick="loadXMLDoc('b.xml')">
Get CD info</button>
</div>
</body>
<!-- awwwb.com -->
</html>
