Ajax realisiert die sekundäre Verknüpfung durch asynchrone XML-Übermittlung

Dieses Mal bringe ich Ihnen Ajax, um eine sekundäre Verknüpfung durch asynchrone XML-Übermittlung zu erreichen. Was sind die Vorsichtsmaßnahmen für Ajax, um eine sekundäre Verknüpfung durch asynchrone XML-Übermittlung zu erreichen? sehen.

Ich habe zuvor über das Abrufen von Provinz- und Stadtinformationen aus dem

JavaScript-Array geschrieben, um eine sekundäre Verknüpfung zu erreichen, aber es scheint, dass es viele Anforderungen gibt, Informationen aus der Datenbank abzurufen, also muss es so sein asynchron eingereicht werden, wird die Idee der teilweisen Aktualisierung implementiert, um Benutzerinteraktionsprobleme zu verbessern

Die erste Methode ist die XML-Methode

1. Erstens ist dieser Code im JavaScript der JSP-Seite universell, sodass er außerhalb der Funktion platziert wird und von anderen Funktionen verwendet werden kann

var xhr=false;
//创建XMLHttpRequst对象
if(window.XMLHttpRequest)
{
xhr=new XMLHttpRequest();
}
else if(window.ActiveXObject)
{
xhr=new ActiveXObject("Microsoft.XMLHTTP");
}
else
{
xhr=false;
}

2. Rufen Sie den Wert des ausgewählten Provinzwerts ab und übergeben Sie ihn durch asynchrone Übermittlung an das Servlet

//获取城市的信息
function getCity()
{
//省份下拉框的对象
var provinceobj=document.getElementById("province");
//被选择的省份的索引
var index=provinceobj.selectedIndex;
//被选择的省份的value值
var provincevalue=provinceobj[index].value;
//被选择的省份的text值
var province=provinceobj[index].Text;
alert(provincevalue);
var url="<%=basepath%>CityServlet";/* post请求不在url上带参数 */
<%-- var url="<%=basepath%>CityServlet?provincevalue="+provincevalue; --%>//get请求在url上带参数
xhr.open("post",url,true);//设置为post提交方式，true表示为异步提交
//post提交方式的时候需要设置提交的编码
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
//当状态改变时，调用callBack_XML来判断是否需要接收数据 
　　　　 xhr.onreadystatechange=callBack_XML;//xml方法 
　　　　//通过post提交的时候需要将数据放到send里传到servlet里 
　　　　xhr.send("provincevalue="+provincevalue); 
　　　　//xhr.send(null); 
　　}

3. Schreiben Sie die RückruffunktioncallBack_XML( ). Diese Funktion bestimmt, wann die Serverantwort normal ist, und verarbeitet sie

function callBack_XML()//xml方法来获取
{
//城市下拉选择框的对象
var cityobj=document.getElementById("city");
//当请求状态等于4时，相应已完成，可以访问服务器响应并使用它
if(xhr.readyState==4)
{
//当状态为200时意味着，状态正常，未出错
if(xhr.status==200)
{
alert("响应成功");
//获取相应的xml文档
var cityxml=xhr.responseXML;
alert(cityxml);
//获取根元素
var root=cityxml.documentElement;
//获取根元素（city_info）下面的所有city元素
var cities=root.getElementsByTagName("city");
//将下拉框内容清除
cityobj.options.length=1;
for(var i=0;i<cities.length;i++)
{
var city=cities[i];
//获取节点的值
var cid=city.childNodes[0].firstChild.nodeValue;
var cname=city.childNodes[2].firstChild.nodeValue;
//alert(cid+" "+cname);
//放到下拉选择框里Option(文本内容,value值);
cityobj.options[cityobj.options.length]=new Option(cname,cid);
}
}
//当状态为404时，表示找不到页面
else if(xhr.status==404)
{
alert("Request URL is not exists!");
}
else
{
alert("Error:Status is:"+request.status);
}
}
}

4 🎜>Damit ist die Verwendung von XML zur Implementierung der asynchronen Übermittlung und teilweisen Aktualisierung zur Erzielung einer sekundären Verknüpfung von Provinzen und Städten abgeschlossen. Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen erhalten Sie Achten Sie auf andere verwandte Artikel auf der chinesischen PHP-Website!

String provincevalue=request.getParameter("provincevalue");
System.out.println("省份编号："+provincevalue);
CityService cityservice=CityService.getCityService();
List<City> citylist=cityservice.getCity(provincevalue);
for(int i=0;i<citylist.size();i++)
{
System.out.println(citylist.get(i));
}
//生成xml页面
StringBuffer xml=new StringBuffer();
xml.append("<?xml version=\"1.0\" encoding=\"UTF-8\"?>");
xml.append("<city_info>");
for(City c : citylist)
{
xml.append("<city>");
xml.append("<id>"+c.getId()+"</id>");
xml.append("<cityid>"+c.getCityid()+"</cityid>");
xml.append("<cityname>"+c.getCity()+"</cityname>");
xml.append("<province>"+c.getFather()+"</province>");
xml.append("</city>");
}
xml.append("</city_info>");
//设置响应字符集编码，防止中文乱码
response.setCharacterEncoding("utf-8");
response.setContentType("text/xml;charset=utf-8");
//将xml文档写出去
PrintWriter writer=response.getWriter();
//因为只能写字符串，所以toString
writer.write(xml.toString());
writer.flush();
writer.close();
}

Empfohlene Lektüre:

So implementieren Sie eine AJAX-Warteschlangenanforderung (mit Code)

Vorwärts, Rückwärts und Aktualisierung von Ajax Seite So implementieren Sie

Das obige ist der detaillierte Inhalt vonAjax realisiert die sekundäre Verknüpfung durch asynchrone XML-Übermittlung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!