目錄

• 效果
• sql數據
• 前后臺代碼實現

效果

• 初始訪問頁面
  

• 選中省會，自動刷新頁面
  
  

sql數據

-- 省市聯動數據CREATE TABLE PROVINCE (PID NUMBER PRIMARY KEY,PNAME VARCHAR(20) NOT NULL )SELECT * FROM PROVINCEINSERT INTO province VALUES (1, '北京市'); INSERT INTO province VALUES (2, '天津市'); INSERT INTO province VALUES (3, '上海市'); INSERT INTO province VALUES (4, '重慶市'); INSERT INTO province VALUES (5, '河北省'); INSERT INTO province VALUES (6, '山西省'); INSERT INTO province VALUES (7, '臺灣省'); INSERT INTO province VALUES (8, '遼寧省'); INSERT INTO province VALUES (9, '吉林省'); INSERT INTO province VALUES (10, '黑龍江省'); INSERT INTO province VALUES (11, '江蘇省'); INSERT INTO province VALUES (12, '浙江省'); INSERT INTO province VALUES (13, '安徽省'); INSERT INTO province VALUES (14, '福建省'); INSERT INTO province VALUES (15, '江西省'); INSERT INTO province VALUES (16, '山東省'); INSERT INTO province VALUES (17, '河南省'); INSERT INTO province VALUES (18, '湖北省'); INSERT INTO province VALUES (19, '湖南省'); INSERT INTO province VALUES (20, '廣東省'); INSERT INTO province VALUES (21, '甘肅省'); INSERT INTO province VALUES (22, '四川省'); INSERT INTO province VALUES (23, '貴州省'); INSERT INTO province VALUES (24, '海南省'); INSERT INTO province VALUES (25, '云南省'); INSERT INTO province VALUES (26, '青海省'); INSERT INTO province VALUES (27, '陜西省'); INSERT INTO province VALUES (28, '廣西壯族自治區'); INSERT INTO province VALUES (29, '西藏自治區'); INSERT INTO province VALUES (30, '寧夏回族自治區'); INSERT INTO province VALUES (31, '新疆維吾爾自治區'); INSERT INTO province VALUES (32, '內蒙古自治區'); INSERT INTO province VALUES (33, '澳門特別行政區'); INSERT INTO province VALUES (34, '香港特別行政區');CREATE TABLE city ( Cid NUMBER NOT NULL primary key, pId NUMBER NOT NULL, Cname varchar(100) NOT NULL )-- DROP TABLE CITYSELECT * FROM CITY ORDER BY CID ASCSELECT * FROM CITY WHERE PID = 1-- 區 INSERT INTO city VALUES (1, 1, '北京市'); INSERT INTO city VALUES (2, 2, '天津市'); INSERT INTO city VALUES (3, 3, '上海市'); INSERT INTO city VALUES (4, 4, '重慶市'); INSERT INTO city VALUES (5, 5, '石家莊市'); INSERT INTO city VALUES (6, 5, '唐山市'); INSERT INTO city VALUES (7, 5, '秦皇島市'); INSERT INTO city VALUES (8, 5, '邯鄲市'); INSERT INTO city VALUES (9, 5, '邢臺市'); INSERT INTO city VALUES (10, 5, '保定市'); INSERT INTO city VALUES (11, 5, '張家口市'); INSERT INTO city VALUES (12, 5, '承德市'); INSERT INTO city VALUES (13, 5, '滄州市'); INSERT INTO city VALUES (14, 5, '廊坊市'); INSERT INTO city VALUES (15, 5, '衡水市'); INSERT INTO city VALUES (16, 6, '太原市'); INSERT INTO city VALUES (17, 6, '大同市'); INSERT INTO city VALUES (18, 6, '陽泉市'); INSERT INTO city VALUES (19, 6, '長治市'); INSERT INTO city VALUES (20, 6, '晉城市'); INSERT INTO city VALUES (21, 6, '朔州市'); INSERT INTO city VALUES (22, 6, '晉中市'); INSERT INTO city VALUES (23, 6, '運城市'); INSERT INTO city VALUES (24, 6, '忻州市'); INSERT INTO city VALUES (25, 6, '呂梁市'); INSERT INTO city VALUES (27, 7, '宜蘭縣'); INSERT INTO city VALUES (36, 7, '南投縣'); INSERT INTO city VALUES (42, 7, '云林縣'); INSERT INTO city VALUES (43, 7, '嘉義縣'); INSERT INTO city VALUES (44, 7, '臺南縣'); INSERT INTO city VALUES (45, 7, '高雄縣'); INSERT INTO city VALUES (46, 7, '屏東縣'); INSERT INTO city VALUES (47, 7, '澎湖縣'); INSERT INTO city VALUES (48, 7, '臺東縣'); INSERT INTO city VALUES (49, 7, '花蓮縣'); INSERT INTO city VALUES (50, 8, '沈陽市'); INSERT INTO city VALUES (51, 8, '大連市'); INSERT INTO city VALUES (52, 8, '鞍山市'); INSERT INTO city VALUES (53, 8, '撫順市'); INSERT INTO city VALUES (54, 8, '本溪市'); INSERT INTO city VALUES (55, 8, '丹東市'); INSERT INTO city VALUES (56, 8, '錦州市'); INSERT INTO city VALUES (57, 8, '營口市'); INSERT INTO city VALUES (58, 8, '阜新市'); INSERT INTO city VALUES (59, 8, '遼陽市'); INSERT INTO city VALUES (60, 8, '盤錦市'); INSERT INTO city VALUES (61, 8, '鐵嶺市'); INSERT INTO city VALUES (62, 8, '朝陽市'); INSERT INTO city VALUES (63, 8, '葫蘆島市'); INSERT INTO city VALUES (64, 9, '長春市'); INSERT INTO city VALUES (65, 9, '吉林市'); INSERT INTO city VALUES (66, 9, '四平市'); INSERT INTO city VALUES (67, 9, '遼源市'); INSERT INTO city VALUES (68, 9, '通化市'); INSERT INTO city VALUES (69, 9, '白山市'); INSERT INTO city VALUES (70, 9, '松原市'); INSERT INTO city VALUES (71, 9, '白城市'); INSERT INTO city VALUES (72, 9, '延邊朝鮮族自治州'); INSERT INTO city VALUES (73, 10, '哈爾濱市'); INSERT INTO city VALUES (74, 10, '齊齊哈爾市'); INSERT INTO city VALUES (75, 10, '鶴崗市'); INSERT INTO city VALUES (76, 10, '雙鴨山市'); INSERT INTO city VALUES (77, 10, '雞西市'); INSERT INTO city VALUES (78, 10, '大慶市'); INSERT INTO city VALUES (79, 10, '伊春市'); INSERT INTO city VALUES (80, 10, '牡丹江市'); INSERT INTO city VALUES (81, 10, '佳木斯市'); INSERT INTO city VALUES (82, 10, '七臺河市'); INSERT INTO city VALUES (83, 10, '黑河市'); INSERT INTO city VALUES (84, 10, '綏化市'); INSERT INTO city VALUES (85, 10, '大興安嶺地區'); INSERT INTO city VALUES (86, 11, '南京市'); INSERT INTO city VALUES (87, 11, '無錫市'); INSERT INTO city VALUES (88, 11, '徐州市'); INSERT INTO city VALUES (89, 11, '常州市'); INSERT INTO city VALUES (90, 11, '蘇州市'); INSERT INTO city VALUES (91, 11, '南通市'); INSERT INTO city VALUES (92, 11, '連云港市'); INSERT INTO city VALUES (93, 11, '淮安市'); INSERT INTO city VALUES (94, 11, '鹽城市'); INSERT INTO city VALUES (95, 11, '揚州市'); INSERT INTO city VALUES (96, 11, '鎮江市'); INSERT INTO city VALUES (97, 11, '泰州市'); INSERT INTO city VALUES (98, 11, '宿遷市'); INSERT INTO city VALUES (99, 12, '杭州市'); INSERT INTO city VALUES (100, 12, '寧波市'); INSERT INTO city VALUES (101, 12, '溫州市'); INSERT INTO city VALUES (102, 12, '嘉興市'); INSERT INTO city VALUES (103, 12, '湖州市'); INSERT INTO city VALUES (104, 12, '紹興市'); INSERT INTO city VALUES (105, 12, '金華市'); INSERT INTO city VALUES (106, 12, '衢州市'); INSERT INTO city VALUES (107, 12, '舟山市'); INSERT INTO city VALUES (108, 12, '臺州市'); INSERT INTO city VALUES (109, 12, '麗水市'); INSERT INTO city VALUES (110, 13, '合肥市'); INSERT INTO city VALUES (111, 13, '蕪湖市'); INSERT INTO city VALUES (112, 13, '蚌埠市'); INSERT INTO city VALUES (113, 13, '淮南市'); INSERT INTO city VALUES (114, 13, '馬鞍山市'); INSERT INTO city VALUES (115, 13, '淮北市'); INSERT INTO city VALUES (116, 13, '銅陵市'); INSERT INTO city VALUES (117, 13, '安慶市'); INSERT INTO city VALUES (118, 13, '黃山市'); INSERT INTO city VALUES (119, 13, '滁州市'); INSERT INTO city VALUES (120, 13, '阜陽市'); INSERT INTO city VALUES (121, 13, '宿州市'); INSERT INTO city VALUES (122, 13, '巢湖市'); INSERT INTO city VALUES (123, 13, '六安市'); INSERT INTO city VALUES (124, 13, '亳州市'); INSERT INTO city VALUES (125, 13, '池州市'); INSERT INTO city VALUES (126, 13, '宣城市'); INSERT INTO city VALUES (127, 14, '福州市'); INSERT INTO city VALUES (128, 14, '廈門市'); INSERT INTO city VALUES (129, 14, '莆田市'); INSERT INTO city VALUES (130, 14, '三明市'); INSERT INTO city VALUES (131, 14, '泉州市'); INSERT INTO city VALUES (132, 14, '漳州市'); INSERT INTO city VALUES (133, 14, '南平市'); INSERT INTO city VALUES (134, 14, '龍巖市'); INSERT INTO city VALUES (135, 14, '寧德市'); INSERT INTO city VALUES (136, 15, '南昌市'); INSERT INTO city VALUES (137, 15, '景德鎮市'); INSERT INTO city VALUES (138, 15, '萍鄉市'); INSERT INTO city VALUES (139, 15, '九江市'); INSERT INTO city VALUES (140, 15, '新余市'); INSERT INTO city VALUES (141, 15, '鷹潭市'); INSERT INTO city VALUES (142, 15, '贛州市'); INSERT INTO city VALUES (143, 15, '吉安市'); INSERT INTO city VALUES (144, 15, '宜春市'); INSERT INTO city VALUES (145, 15, '撫州市'); INSERT INTO city VALUES (146, 15, '上饒市'); INSERT INTO city VALUES (147, 16, '濟南市'); INSERT INTO city VALUES (148, 16, '青島市'); INSERT INTO city VALUES (149, 16, '淄博市'); INSERT INTO city VALUES (150, 16, '棗莊市'); INSERT INTO city VALUES (151, 16, '東營市'); INSERT INTO city VALUES (152, 16, '煙臺市'); INSERT INTO city VALUES (153, 16, '濰坊市'); INSERT INTO city VALUES (154, 16, '濟寧市'); INSERT INTO city VALUES (155, 16, '泰安市'); INSERT INTO city VALUES (156, 16, '威海市'); INSERT INTO city VALUES (157, 16, '日照市'); INSERT INTO city VALUES (158, 16, '萊蕪市'); INSERT INTO city VALUES (159, 16, '臨沂市'); INSERT INTO city VALUES (160, 16, '德州市'); INSERT INTO city VALUES (161, 16, '聊城市'); INSERT INTO city VALUES (162, 16, '濱州市'); INSERT INTO city VALUES (163, 16, '菏澤市'); INSERT INTO city VALUES (164, 17, '鄭州市'); INSERT INTO city VALUES (165, 17, '開封市'); INSERT INTO city VALUES (166, 17, '洛陽市'); INSERT INTO city VALUES (167, 17, '平頂山市'); INSERT INTO city VALUES (168, 17, '安陽市'); INSERT INTO city VALUES (169, 17, '鶴壁市'); INSERT INTO city VALUES (170, 17, '新鄉市'); INSERT INTO city VALUES (171, 17, '焦作市'); INSERT INTO city VALUES (172, 17, '濮陽市'); INSERT INTO city VALUES (173, 17, '許昌市'); INSERT INTO city VALUES (174, 17, '漯河市'); INSERT INTO city VALUES (175, 17, '三門峽市'); INSERT INTO city VALUES (176, 17, '南陽市'); INSERT INTO city VALUES (177, 17, '商丘市'); INSERT INTO city VALUES (178, 17, '信陽市'); INSERT INTO city VALUES (179, 17, '周口市'); INSERT INTO city VALUES (180, 17, '駐馬店市'); INSERT INTO city VALUES (181, 17, '濟源市'); INSERT INTO city VALUES (182, 18, '武漢市'); INSERT INTO city VALUES (183, 18, '黃石市'); INSERT INTO city VALUES (184, 18, '十堰市'); INSERT INTO city VALUES (185, 18, '荊州市'); INSERT INTO city VALUES (186, 18, '宜昌市'); INSERT INTO city VALUES (187, 18, '襄樊市'); INSERT INTO city VALUES (188, 18, '鄂州市'); INSERT INTO city VALUES (189, 18, '荊門市'); INSERT INTO city VALUES (190, 18, '孝感市'); INSERT INTO city VALUES (191, 18, '黃岡市'); INSERT INTO city VALUES (192, 18, '咸寧市'); INSERT INTO city VALUES (193, 18, '隨州市'); INSERT INTO city VALUES (194, 18, '仙桃市'); INSERT INTO city VALUES (195, 18, '天門市'); INSERT INTO city VALUES (196, 18, '潛江市'); INSERT INTO city VALUES (197, 18, '神農架林區'); INSERT INTO city VALUES (198, 18, '恩施土家族苗族自治州'); INSERT INTO city VALUES (199, 19, '長沙市'); INSERT INTO city VALUES (200, 19, '株洲市'); INSERT INTO city VALUES (201, 19, '湘潭市'); INSERT INTO city VALUES (202, 19, '衡陽市'); INSERT INTO city VALUES (203, 19, '邵陽市'); INSERT INTO city VALUES (204, 19, '岳陽市'); INSERT INTO city VALUES (205, 19, '常德市'); INSERT INTO city VALUES (206, 19, '張家界市'); INSERT INTO city VALUES (207, 19, '益陽市'); INSERT INTO city VALUES (208, 19, '郴州市'); INSERT INTO city VALUES (209, 19, '永州市'); INSERT INTO city VALUES (210, 19, '懷化市'); INSERT INTO city VALUES (211, 19, '婁底市'); INSERT INTO city VALUES (212, 19, '湘西土家族苗族自治州'); INSERT INTO city VALUES (213, 20, '廣州市'); INSERT INTO city VALUES (214, 20, '深圳市'); INSERT INTO city VALUES (215, 20, '珠海市'); INSERT INTO city VALUES (216, 20, '汕頭市'); INSERT INTO city VALUES (217, 20, '韶關市'); INSERT INTO city VALUES (218, 20, '佛山市'); INSERT INTO city VALUES (219, 20, '江門市'); INSERT INTO city VALUES (220, 20, '湛江市'); INSERT INTO city VALUES (221, 20, '茂名市'); INSERT INTO city VALUES (222, 20, '肇慶市'); INSERT INTO city VALUES (223, 20, '惠州市'); INSERT INTO city VALUES (224, 20, '梅州市'); INSERT INTO city VALUES (225, 20, '汕尾市'); INSERT INTO city VALUES (226, 20, '河源市'); INSERT INTO city VALUES (227, 20, '陽江市'); INSERT INTO city VALUES (228, 20, '清遠市'); INSERT INTO city VALUES (229, 20, '東莞市'); INSERT INTO city VALUES (230, 20, '中山市'); INSERT INTO city VALUES (231, 20, '潮州市'); INSERT INTO city VALUES (232, 20, '揭陽市'); INSERT INTO city VALUES (233, 20, '云浮市'); INSERT INTO city VALUES (234, 21, '蘭州市'); INSERT INTO city VALUES (235, 21, '金昌市'); INSERT INTO city VALUES (236, 21, '白銀市'); INSERT INTO city VALUES (237, 21, '天水市'); INSERT INTO city VALUES (238, 21, '嘉峪關市'); INSERT INTO city VALUES (239, 21, '武威市'); INSERT INTO city VALUES (240, 21, '張掖市'); INSERT INTO city VALUES (241, 21, '平涼市'); INSERT INTO city VALUES (242, 21, '酒泉市'); INSERT INTO city VALUES (243, 21, '慶陽市'); INSERT INTO city VALUES (244, 21, '定西市'); INSERT INTO city VALUES (245, 21, '隴南市'); INSERT INTO city VALUES (246, 21, '臨夏回族自治州'); INSERT INTO city VALUES (247, 21, '甘南藏族自治州'); INSERT INTO city VALUES (248, 22, '成都市'); INSERT INTO city VALUES (249, 22, '自貢市'); INSERT INTO city VALUES (250, 22, '攀枝花市'); INSERT INTO city VALUES (251, 22, '瀘州市'); INSERT INTO city VALUES (252, 22, '德陽市'); INSERT INTO city VALUES (253, 22, '綿陽市'); INSERT INTO city VALUES (254, 22, '廣元市'); INSERT INTO city VALUES (255, 22, '遂寧市'); INSERT INTO city VALUES (256, 22, '內江市'); INSERT INTO city VALUES (257, 22, '樂山市'); INSERT INTO city VALUES (258, 22, '南充市'); INSERT INTO city VALUES (259, 22, '眉山市'); INSERT INTO city VALUES (260, 22, '宜賓市'); INSERT INTO city VALUES (261, 22, '廣安市'); INSERT INTO city VALUES (262, 22, '達州市'); INSERT INTO city VALUES (263, 22, '雅安市'); INSERT INTO city VALUES (264, 22, '巴中市'); INSERT INTO city VALUES (265, 22, '資陽市'); INSERT INTO city VALUES (266, 22, '阿壩藏族羌族自治州'); INSERT INTO city VALUES (267, 22, '甘孜藏族自治州'); INSERT INTO city VALUES (268, 22, '涼山彝族自治州'); INSERT INTO city VALUES (269, 23, '貴陽市'); INSERT INTO city VALUES (270, 23, '六盤水市'); INSERT INTO city VALUES (271, 23, '遵義市'); INSERT INTO city VALUES (272, 23, '安順市'); INSERT INTO city VALUES (273, 23, '銅仁地區'); INSERT INTO city VALUES (274, 23, '畢節地區'); INSERT INTO city VALUES (275, 23, '黔西南布依族苗族自治州'); INSERT INTO city VALUES (276, 23, '黔東南苗族侗族自治州'); INSERT INTO city VALUES (277, 23, '黔南布依族苗族自治州'); INSERT INTO city VALUES (278, 24, '海口市'); INSERT INTO city VALUES (279, 24, '三亞市'); INSERT INTO city VALUES (280, 24, '五指山市'); INSERT INTO city VALUES (281, 24, '瓊海市'); INSERT INTO city VALUES (282, 24, '儋州市'); INSERT INTO city VALUES (283, 24, '文昌市'); INSERT INTO city VALUES (284, 24, '萬寧市'); INSERT INTO city VALUES (285, 24, '東方市'); INSERT INTO city VALUES (286, 24, '澄邁縣'); INSERT INTO city VALUES (287, 24, '定安縣'); INSERT INTO city VALUES (288, 24, '屯昌縣'); INSERT INTO city VALUES (289, 24, '臨高縣'); INSERT INTO city VALUES (290, 24, '白沙黎族自治縣'); INSERT INTO city VALUES (291, 24, '昌江黎族自治縣'); INSERT INTO city VALUES (292, 24, '樂東黎族自治縣'); INSERT INTO city VALUES (293, 24, '陵水黎族自治縣'); INSERT INTO city VALUES (294, 24, '保亭黎族苗族自治縣'); INSERT INTO city VALUES (295, 24, '瓊中黎族苗族自治縣'); INSERT INTO city VALUES (296, 25, '昆明市'); INSERT INTO city VALUES (297, 25, '曲靖市'); INSERT INTO city VALUES (298, 25, '玉溪市'); INSERT INTO city VALUES (299, 25, '保山市'); INSERT INTO city VALUES (300, 25, '昭通市'); INSERT INTO city VALUES (301, 25, '麗江市'); INSERT INTO city VALUES (302, 25, '思茅市'); INSERT INTO city VALUES (303, 25, '臨滄市'); INSERT INTO city VALUES (304, 25, '文山壯族苗族自治州'); INSERT INTO city VALUES (305, 25, '紅河哈尼族彝族自治州'); INSERT INTO city VALUES (306, 25, '西雙版納傣族自治州'); INSERT INTO city VALUES (307, 25, '楚雄彝族自治州'); INSERT INTO city VALUES (308, 25, '大理白族自治州'); INSERT INTO city VALUES (309, 25, '德宏傣族景頗族自治州'); INSERT INTO city VALUES (310, 25, '怒江傈傈族自治州'); INSERT INTO city VALUES (311, 25, '迪慶藏族自治州'); INSERT INTO city VALUES (312, 26, '西寧市'); INSERT INTO city VALUES (313, 26, '海東地區'); INSERT INTO city VALUES (314, 26, '海北藏族自治州'); INSERT INTO city VALUES (315, 26, '黃南藏族自治州'); INSERT INTO city VALUES (316, 26, '海南藏族自治州'); INSERT INTO city VALUES (317, 26, '果洛藏族自治州'); INSERT INTO city VALUES (318, 26, '玉樹藏族自治州'); INSERT INTO city VALUES (319, 26, '海西蒙古族藏族自治州'); INSERT INTO city VALUES (320, 27, '西安市'); INSERT INTO city VALUES (321, 27, '銅川市'); INSERT INTO city VALUES (322, 27, '寶雞市'); INSERT INTO city VALUES (323, 27, '咸陽市'); INSERT INTO city VALUES (324, 27, '渭南市'); INSERT INTO city VALUES (325, 27, '延安市'); INSERT INTO city VALUES (326, 27, '漢中市'); INSERT INTO city VALUES (327, 27, '榆林市'); INSERT INTO city VALUES (328, 27, '安康市'); INSERT INTO city VALUES (329, 27, '商洛市'); INSERT INTO city VALUES (330, 28, '南寧市'); INSERT INTO city VALUES (331, 28, '柳州市'); INSERT INTO city VALUES (332, 28, '桂林市'); INSERT INTO city VALUES (333, 28, '梧州市'); INSERT INTO city VALUES (334, 28, '北海市'); INSERT INTO city VALUES (335, 28, '防城港市'); INSERT INTO city VALUES (336, 28, '欽州市'); INSERT INTO city VALUES (337, 28, '貴港市'); INSERT INTO city VALUES (338, 28, '玉林市'); INSERT INTO city VALUES (339, 28, '百色市'); INSERT INTO city VALUES (340, 28, '賀州市'); INSERT INTO city VALUES (341, 28, '河池市'); INSERT INTO city VALUES (342, 28, '來賓市'); INSERT INTO city VALUES (343, 28, '崇左市'); INSERT INTO city VALUES (344, 29, '拉薩市'); INSERT INTO city VALUES (345, 29, '那曲地區'); INSERT INTO city VALUES (346, 29, '昌都地區'); INSERT INTO city VALUES (347, 29, '山南地區'); INSERT INTO city VALUES (348, 29, '日喀則地區'); INSERT INTO city VALUES (349, 29, '阿里地區'); INSERT INTO city VALUES (350, 29, '林芝地區'); INSERT INTO city VALUES (351, 30, '銀川市'); INSERT INTO city VALUES (352, 30, '石嘴山市'); INSERT INTO city VALUES (353, 30, '吳忠市'); INSERT INTO city VALUES (354, 30, '固原市'); INSERT INTO city VALUES (355, 30, '中衛市'); INSERT INTO city VALUES (356, 31, '烏魯木齊市'); INSERT INTO city VALUES (357, 31, '克拉瑪依市'); INSERT INTO city VALUES (358, 31, '石河子市　'); INSERT INTO city VALUES (359, 31, '阿拉爾市'); INSERT INTO city VALUES (360, 31, '圖木舒克市'); INSERT INTO city VALUES (361, 31, '五家渠市'); INSERT INTO city VALUES (362, 31, '吐魯番市'); INSERT INTO city VALUES (363, 31, '阿克蘇市'); INSERT INTO city VALUES (364, 31, '喀什市'); INSERT INTO city VALUES (365, 31, '哈密市'); INSERT INTO city VALUES (366, 31, '和田市'); INSERT INTO city VALUES (367, 31, '阿圖什市'); INSERT INTO city VALUES (368, 31, '庫爾勒市'); INSERT INTO city VALUES (369, 31, '昌吉市　'); INSERT INTO city VALUES (370, 31, '阜康市'); INSERT INTO city VALUES (371, 31, '米泉市'); INSERT INTO city VALUES (372, 31, '博樂市'); INSERT INTO city VALUES (373, 31, '伊寧市'); INSERT INTO city VALUES (374, 31, '奎屯市'); INSERT INTO city VALUES (375, 31, '塔城市'); INSERT INTO city VALUES (376, 31, '烏蘇市'); INSERT INTO city VALUES (377, 31, '阿勒泰市'); INSERT INTO city VALUES (378, 32, '呼和浩特市'); INSERT INTO city VALUES (379, 32, '包頭市'); INSERT INTO city VALUES (380, 32, '烏海市'); INSERT INTO city VALUES (381, 32, '赤峰市'); INSERT INTO city VALUES (382, 32, '通遼市'); INSERT INTO city VALUES (383, 32, '鄂爾多斯市'); INSERT INTO city VALUES (384, 32, '呼倫貝爾市'); INSERT INTO city VALUES (385, 32, '巴彥淖爾市'); INSERT INTO city VALUES (386, 32, '烏蘭察布市'); INSERT INTO city VALUES (387, 32, '錫林郭勒盟'); INSERT INTO city VALUES (388, 32, '興安盟'); INSERT INTO city VALUES (389, 32, '阿拉善盟'); INSERT INTO city VALUES (390, 33, '澳門特別行政區'); INSERT INTO city VALUES (391, 34, '香港特別行政區');

前后臺代碼實現

• 所需工具

dom4j.jar -- 解析xml庫 ojdbc6.jar -- 數據庫驅動包

• entity，dao層實現

• basedao

package dao;import java.sql.Connection; import java.sql.DriverManager; import java.sql.PreparedStatement; import java.sql.ResultSet; import java.sql.SQLException;public class BaseDao {static {try {Class.forName("oracle.jdbc.OracleDriver");} catch (ClassNotFoundException e) {e.printStackTrace();}}public static Connection getConn() throws SQLException {Connection conn = null;String url = "jdbc:oracle:thin:@127.0.0.1:1521:orcl";conn = DriverManager.getConnection(url, "scott", "scott");return conn;}public static void closeAll(Connection conn, PreparedStatement ps, ResultSet rs) {try {if (rs != null)rs.close();if (ps != null)ps.close();if (conn != null)conn.close();} catch (SQLException e) {e.printStackTrace();}} }

• citydao

package dao;import java.sql.Connection; import java.sql.PreparedStatement; import java.sql.ResultSet; import java.sql.SQLException; import java.util.ArrayList; import java.util.List;import entity.City;public class CityDao {public List<City> queryCityByPid(int pId) {List<City> list = new ArrayList<City>();String sql = "SELECT * FROM CITY WHERE PID = ?";Connection conn = null;PreparedStatement ps = null;ResultSet rs = null;try {conn = BaseDao.getConn();ps = conn.prepareStatement(sql);ps.setInt(1, pId);rs = ps.executeQuery();while (rs.next()) {City city = new City();city.setcId(rs.getInt("cid"));city.setpId(rs.getInt("pid"));city.setcName(rs.getString("cname"));list.add(city);}} catch (SQLException e) {e.printStackTrace();} finally {BaseDao.closeAll(conn, ps, rs);} return list;} }

• provincedao

package dao;import java.sql.Connection; import java.sql.PreparedStatement; import java.sql.ResultSet; import java.sql.SQLException; import java.util.ArrayList; import java.util.List;import entity.Province;public class ProvinceDao {public List<Province> queryAllProvince() {List<Province> list = new ArrayList<Province>();String sql = "SELECT * FROM PROVINCE";Connection conn = null;PreparedStatement ps = null;ResultSet rs = null;try {conn = BaseDao.getConn();ps = conn.prepareStatement(sql);rs = ps.executeQuery();while (rs.next()) {Province pro = new Province();pro.setpId(rs.getInt("pid"));pro.setpName(rs.getString("pname"));list.add(pro);}} catch (SQLException e) {e.printStackTrace();} finally {BaseDao.closeAll(conn, ps, rs);} return list;}}

• servlet

package servlet;import java.io.IOException; import java.util.List;import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse;import org.dom4j.Document; import org.dom4j.DocumentHelper; import org.dom4j.Element;import dao.ProvinceDao; import entity.Province;public class QueryAllProvince extends HttpServlet {/*** 查詢所有省會 加載到下拉框*/private static final long serialVersionUID = 1L;@Overrideprotected void service(HttpServletRequest req, HttpServletResponse resp)throws ServletException, IOException {ProvinceDao dao = new ProvinceDao();List<Province> list = dao.queryAllProvince();Document doc = DocumentHelper.createDocument();// dom4j創建根結點Element root = doc.addElement("ProvinceInfo");for (Province p : list) {// 每個省級結點信息Element provinceRoot = root.addElement("province");provinceRoot.addElement("pId").setText("" + p.getpId());provinceRoot.addElement("pName").setText("" + p.getpName());}// 把內存中創建的xml轉成stringString provinceXml = doc.asXML();resp.setContentType("text/xml;charset=utf-8");// 以xml字符串的形式發送到前臺resp.getWriter().write(provinceXml);}} package servlet;import java.io.IOException; import java.util.List;import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse;import org.dom4j.Document; import org.dom4j.DocumentHelper; import org.dom4j.Element;import dao.CityDao; import entity.City;public class QueryCity extends HttpServlet {/*** 根據省會id查詢城市*/private static final long serialVersionUID = 1L;@Overrideprotected void service(HttpServletRequest req, HttpServletResponse resp)throws ServletException, IOException {Integer pId = Integer.parseInt(req.getParameter("pId"));CityDao dao = new CityDao();List<City> list = dao.queryCityByPid(pId);Document doc = DocumentHelper.createDocument();Element root = doc.addElement("cityInfo");for (City city : list) {Element cityRoot = root.addElement("city");cityRoot.addElement("cId").setText(city.getcId() + "");cityRoot.addElement("pId").setText(city.getpId() + "");cityRoot.addElement("cName").setText(city.getcName() + "");}String cityXml = doc.asXML();resp.setContentType("text/xml;charset=utf-8");// 以xml字符串的形式發送到前臺resp.getWriter().write(cityXml); }}

• 前臺頁面

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html><head><base href="<%=basePath%>"><title>My JSP 'province_city_linkage.jsp' starting page</title><meta http-equiv="pragma" content="no-cache"><meta http-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="This is my page"><script type="text/javascript">function loadProvince() {var ajax = new XMLHttpRequest();ajax.onreadystatechange = function() {if (ajax.status == 200 && ajax.readyState == 4) {// 拿到下拉框var proSelect = document.getElementById("province");// servlet響應的xml對象var provinceXml = ajax.responseXML;// 獲取xml的省會結點var provinceArr = provinceXml.getElementsByTagName("province");for (var i = 0; i < provinceArr.length; i++) {var pId = provinceArr[i].firstChild.firstChild.nodeValue; // 這里取結點根據你的xml結構來取var pName = provinceArr[i].lastChild.firstChild.nodeValue;proSelect.add(new Option(pName, pId));}}};ajax.open("get", "QueryAllProvince", true);ajax.send();}loadProvince();function loadCity(pId) {if (pId == 0)return;var citySelect = document.getElementById("city");citySelect.length = 1;var ajax = new XMLHttpRequest();ajax.onreadystatechange = function() {if (ajax.status == 200 && ajax.readyState == 4) {var cityXml = ajax.responseXML;var cityArr = cityXml.getElementsByTagName("city");for (var i = 0; i < cityArr.length; i++) {var cId = cityArr[i].firstChild.firstChild.nodeValue;var cName = cityArr[i].lastChild.firstChild.nodeValue;// 下拉框值在后, value在前citySelect.add(new Option(cName, cId));}}};ajax.open("get", "QueryCity?pId=" + pId, true);ajax.send();}</script></head><body><select id="province" onchange="loadCity(this.value)"><option value="0">請選擇省會</option></select><select id="city"><option value="0">請選擇城市</option></select> </body> </html>

最原始的方法…

總結

以上是生活随笔為你收集整理的ajax下拉框省市级联动的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。