Maison > interface Web > js tutoriel > Menu déroulant de liaison à trois niveaux de province et de ville AJAX (version Java)

Menu déroulant de liaison à trois niveaux de province et de ville AJAX (version Java)

高洛峰
Libérer: 2017-01-12 09:16:49
original
1555 Les gens l'ont consulté

La fonction de cette applet est principalement d'utiliser la méthode de requête asynchrone pour récupérer les informations sur la province et la ville de la base de données et les afficher dans la liste déroulante :

Le code est le suivant :

Créez le code dans la base de données et certaines informations du fichier de configuration sont omises. Le code principal en JavaScript est :

$(document).ready(function(){
$.get("getProvince.do", function(result){
$("#showp").html(result);
});
})
var xmlhttp;
function mysend(str){
$(document).ready(function(){
$("#show2").html("");
})
var show = document.getElementByIdx_x_x_x_x_x_x_x_x_x("show");
show.innerHTML = "";
var province = document.getElementByIdx_x_x_x_x_x_x_x_x_x("province").value;
if(province!=0){
if(window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}else{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function(){
if(xmlhttp.readyState==4 && xmlhttp.status==200){
show.innerHTML = xmlhttp.responseText;
}
}
var ss = encodeURIComponent(str);
xmlhttp.open("GET","getCity.do?provinceid="+ss,true);
xmlhttp.send(null);
}
}
function myarea(str){
if(window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}else{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function(){
if(xmlhttp.readyState==4 && xmlhttp.status==200){
var show2 = document.getElementByIdx_x_x_x_x_x_x_x_x_x("show2");
show2.innerHTML = xmlhttp.responseText;
}
}
var ss = encodeURIComponent(str);
xmlhttp.open("GET","getArea.do?cityid="+ss,true);
xmlhttp.send(null);
}
Copier après la connexion

Le code dans la page html est :

. Emplacement

Le code dans l'action est :

package mobi.zhangsheng.jiejia.action;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.List;
import javax.annotation.Resource;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts2.ServletActionContext;
import org.springframework.stereotype.Controller;
import mobi.zhangsheng.jiejia.domain.Areas;
import mobi.zhangsheng.jiejia.service.AgentsService;
import mobi.zhangsheng.jiejia.service.AreasService;
@Controller
public class ProvinceAction {
private int provinceid;
private int cityid;
@Resource
private AreasService as;
@Resource
private AgentsService ags;
public int getProvinceid() {
return provinceid;
}
public void setProvinceid(int provinceid) {
this.provinceid = provinceid;
}
public int getCityid() {
return cityid;
}
public void setCityid(int cityid) {
this.cityid = cityid;
}
public void getProvince(){
List provinceList = as.getAreasPrvinceList();
HttpServletResponse resp= ServletActionContext.getResponse();
HttpServletRequest request = ServletActionContext.getRequest();
//resp.setContentType("xml");
resp.setContentType("text/html");
resp.setCharacterEncoding("utf-8");
try {
PrintWriter out = resp.getWriter();
out.print("<img id="theimg" onclick="window.open(this.src)" src="http://files.jb51.net/file_images/article/201601/2016113145609190.png?2016013145623" alt="">");
//out.print("shanghai");
} catch (IOException e) {
e.printStackTrace();
}
}
public void getCity(){
List cityList = as.getAreasCityList(provinceid);
HttpServletResponse resp= ServletActionContext.getResponse();
//resp.setContentType("xml");
resp.setContentType("text/html");
resp.setCharacterEncoding("utf-8");
try {
PrintWriter out = resp.getWriter();
out.print("<img id="theimg" onclick="window.open(this.src)" src="http://files.jb51.net/file_images/article/201601/2016113145748247.png?201601314582" alt="">");
//out.print("shanghai");
} catch (IOException e) {
e.printStackTrace();
}
}
public void getArea(){
List areaList = as.getAreasCityList(cityid);
if(areaList.size()==0){
}else{
HttpServletResponse resp= ServletActionContext.getResponse();
resp.setContentType("text/html");
resp.setCharacterEncoding("utf-8");
try {
PrintWriter out = resp.getWriter();
out.print("<img id="theimg" onclick="window.open(this.src)" src="http://files.jb51.net/file_images/article/201601/2016113145524106.png?2016013145549" alt="">");
} catch (IOException e) {
e.printStackTrace();
}
}
}
}
Copier après la connexion

Pour plus d'articles liés aux menus déroulants de liaison à trois niveaux provinciaux et municipaux AJAX (version Java), veuillez faire attention au site Web PHP chinois !

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal