jquery的ajax中的几种状态

最新推荐文章于 2023-01-06 23:07:47 发布

manx00

最新推荐文章于 2023-01-06 23:07:47 发布

阅读量720

点赞数

文章标签： jquery ajax function javascript xml encoding

本文链接：https://blog.csdn.net/manx00/article/details/5768932

版权

xml文件
myfile.xml
<?xml version="1.0" encoding="utf-8" ?>
<List>
  <CB cname="北京" cid="1">
    <CS cname="北京" cid="364">北京市</CS>
  </CB>
  <CB cname="天津" cid="2">
    <CS cname="天津" cid="365">天津市</CS>
  </CB>
  <CB cname="上海" cid="3">
    <CS cname="上海" cid="364">上海市</CS>
  </CB>
  <CB cname="重庆" cid="4">
    <CS cname="重庆" cid="365">重庆市</CS>
  </CB>
</List>
*********************************************************

展示页面xml.php
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>xml运用</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("有错误！");
   },
   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><hr />");
    });
   }
  });
});
$("#show").ajaxStart(function(){
  $(this).append("<font color=red>1、准备开始</font>");
});
$("#show").ajaxSend(function(){
  $(this).append("<font color=red>2、开始发送</font>");
});
$("#show").ajaxSuccess(function(){
  $(this).append("<font color=red>3、传送成功</font>");
});
$("#show").ajaxComplete(function(){
  $(this).append("<font color=red>4、传送完成</font>");
});
$("#show").ajaxStop(function(){
  $(this).append("<font color=red>5、传送停止</font>");
});
$("#show").ajaxError(function(){
  $(this).append("<font color=red>传送失败</font>");
});

});
</script>
</head>
<body>
<button οnclick="startajax();">开始ajax</button>
<div id="show"></div>
</body>
</html>
//注意：ajaxSend，ajaxStart等都是全局事件，放到其他事件外才能正确显示，否则只能运行ajaxSuccess，ajaxComplete，ajaxStop