XML file
Myfile.xml
<?xml version= "1.0" encoding= "Utf-8"?>
<List>
<CB cname= "Beijing" cid= "1" >
<cs cname= "Beijing" cid= "364" > Beijing </CS>
</CB>
<CB cname= "Tianjin" cid= "2" >
<cs cname= "Tianjin" cid= "365" > Tianjin </CS>
</CB>
<CB cname= "Shanghai" cid= "3" >
<cs cname= "Shanghai" cid= "364" > Shanghai </CS>
</CB>
<CB cname= "Chongqing" cid= "4" >
<cs cname= "Chongqing" cid= "365" > Chongqing </CS>
</CB>
</List>
*********************************************************
Show Page xml.php
<meta http-equiv= "Content-type" content= "Text/html;charset=utf-8" >
<title>xml Application </title>
<script language= "javascript" src= "Jquery.js" ></script>
<script language= "JavaScript" >
$ (document). Ready (function () {
$ ("button"). Click (function () {
$.ajax ({
Type: "Post",
URL: "Myfile.xml",
DataType: "xml",
Error:function () {
Alert ("There is an error.) ");
},
Success:function (XML) {
$ (XML). Find ("CB"). each (function () {
var cs = $ (this). FIND ("CS"). text ();
Alert ($ (this). Find ("CS"). attr ("CNAME");
$ ("#show"). Append ("<font color=maroon>" + cs + "</font>});
}
});
});
$ ("#show"). Ajaxstart (function () {
$ (this). Append ("<font color=red>1, ready to start </font>");
});
$ ("#show"). Ajaxsend (function () {
$ (this). Append ("<font color=red>2, start sending </font>");
});
$ ("#show"). Ajaxsuccess (function () {
$ (this). Append ("<font color=red>3, Transmission success </font>");
});
$ ("#show"). Ajaxcomplete (function () {
$ (this). Append ("<font color=red>4, Transmission completed </font>");
});
$ ("#show"). Ajaxstop (function () {
$ (this). Append ("<font color=red>5, Transmission stop </font>");
});
$ ("#show"). Ajaxerror (function () {
$ (this). Append ("<font color=red> transmission Failure </font>");
});
});
</script>
<body>
<button onclick= "Startajax ();" > Start ajax</button>
<div id= "Show" ></div>
</body>
Note: Ajaxsend,ajaxstart are global events that can be displayed correctly outside of other events, otherwise you can only run Ajaxsuccess,ajaxcomplete,ajaxstop
