当前位置：Gxlcms > 数据库问题 > 虚拟数据库_json_ajax

虚拟数据库_json_ajax

时间：2021-07-01 10:21:17 帮助过：28人阅读

0; padding: 0; } body { font-size: 13px; line-height: 130%; padding: 60px } </style> <link rel="stylesheet" type="text/css" href="../css/style.css" /> <script src="../js/jquery-2.1.1.min.js" type="text/javascript"></script> </head> <body> <select name="first" id="first" style="width:160px"> <option value="0">---请选择---</option> <option value="1">中国</option> <option value="2">美国</option> <option value="3">英国</option> </select> <select name="second" id="second" size="3" style="width:160px"></select> <script type="text/javascript"> $(function() { $("#first").change(function() { id=document.getElementById("first").value; $.ajax({ url : "../jsp/second2.jsp", dataType : "json", data:"id="+id, success : function(data) { var cttylist=eval(data); var seconddd = document.getElementById("second"); seconddd.innerHTML=null; for ( var i = 0; i < cttylist.length; i++) { var op = document.createElement("option"); op.innerHTML = cttylist[i].name; seconddd.appendChild(op); } }, error : function(data) { alert(data); } }); }); }); </script> </body> </html>

jsp

<%@ page language="java" import="java.util.*,com.sy.City,com.sy.CityService,net.sf.json.JSONArray" pageEncoding="ISO-8859-1"%>
<%
    //接受传过来的数据
    String strid=(String)request.getParameter("id");
    Integer id=Integer.parseInt(strid);
    //根据id获得书名列表
    List<City> citylist=new CityService().getCityByCategory(id);
    //设置传输编码
    response.setContentType("text/html;charset=UTF-8");
    //将json解析后输出到前台
    out.println(JSONArray.fromObject(citylist));
%>

java City.java

package com.sy;

public class City {
Integer cid;
String cname;
public Integer getId() {
    return cid;
}
public void setId(Integer id) {
    this.cid = id;
}
public String getName() {
    return cname;
}
public void setName(String cname) {
    this.cname = cname;
}
public City(Integer cid, String cname) {
    super();
    this.cid = cid;
    this.cname = cname;
}

}

java CityService.java

package com.sy;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;


public class CityService {
    static Map<Integer , List<City>> CityDb = new HashMap<Integer , List<City>>();
    static {
        List<City> list1 = new ArrayList<City>();
        List<City> list2 = new ArrayList<City>();
        List<City> list3 = new ArrayList<City>();
        list1.add(new City(1 , "山东"));
        list1.add(new City(1 , "北京"));
        list1.add(new City(1 , "上海"));
        list2.add(new City(2 , "美1"));
        list2.add(new City(2 , "美2"));
        list3.add(new City(3 , "英1"));
        list3.add(new City(3 , "英2"));
        list3.add(new City(3 , "英3"));
        CityDb.put(1 , list1);
        CityDb.put(2 , list2);
        CityDb.put(3 , list3);
    }
    public List<City> getCityByCategory(int categoryId) {
        return CityDb.get(categoryId);
    }
}

虚拟数据库_json_ajax

标签：coding pen ajax 解析 map end jquer innerhtml oct

虚拟数据库_json_ajax

人气教程排行