【WEB基础】④关于AJAX

来源：互联网发布：书法大师软件下载编辑：程序博客网时间：2024/05/06 04:03

就现在接触所见，我把AJAX分为两种：

1.纯JS

  <script language="javascript" type="text/javascript" charset="utf-8">  var xmlHttp;  <!--创建传输对象-->  function createXMLHttpRequest()  {     if(window.ActiveXObject)     {        xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");     }     else if(window.XMLHttpRequest)     {        xmlHttp=new XMLHttpRequest();     }  }  <!--调动函数，向后台传值-->  function select_change()  {     var deptNames=document.getElementById("deptNames").value;     if(deptNames!=null){          createXMLHttpRequest();          var url="action.DeptChangeJListServlet?deptNames="+deptNames;          xmlHttp.open("POST",url,true);          xmlHttp.onreadystatechange=showMember;          xmlHttp.send(null);          }  }  <!--接收后台数据-->  function showMember()  {     if(xmlHttp.readyState==4)     {        if(xmlHttp.status==200)        {           <!--以纯文本格式接收后台数据-->           var membersData=xmlHttp.responseText;           <!--以标签为标识接收后台数据-->           var membersData=xmlHttp.responseXML.getElementsByTagName("jobNames");           var membersSelect=document.getElementById("jobNames");           membersSelect.options.length=0;                      for(var i=1;i<membersData.length;i++)           {                          var mvalue=membersData[i].childNodes[1].firstChild.nodeValue;             var option=new Option(mvalue,mvalue);             try             {                membersSelect.appendChild(option);             }             catch(e)             {                alert(e);             }           }        }        else        {           alert("您请求的页面有异常！");        }     }     else     {     }  }  </script>

2.Jquery

<script type="text/javascript" src="resources/scripts/jquery-1.2.6-vsdoc-cn.js"></script>    <script type="text/javascript">        function textLoginName() {                $.ajax({                    type: "post",                    url:"action.NameCheckServlet",                    data: "loginName=" + $('#loginName').val(),                    success: function(data, textStatus) {                        $("#loginNames").html("");                        $("#loginNames").append(data);                    },                    error: function() {                        alert('出错了！');                    }                });            }    </script>

后台

response.setContentType("text/html,charset=utf-8");response.setHeader("Charset", "utf-8");response.setCharacterEncoding("utf-8");//设置输出编码格式PrintWriter out=response.getWriter();

sb.append("<jobNames>");Map map=new DeptChangeService().DeptChange();List list =(List) map.get(deptNames);System.out.println();for (Object object : list) {<span style="white-space:pre"></span>sb.append("<jobNames><id>"+1+"</id><name>"+object.toString()+"</name></jobNames>");<span style="white-space:pre"></span>}<span style="white-space:pre"></span>sb.append("</jobNames>");<span style="white-space:pre"></span>out.write(sb.toString());<span style="white-space:pre"></span>out.flush();<span style="white-space:pre"></span>out.close();

0 0