就现在接触所见,我把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();