• 第三十五节(java-动态加载级联菜单)


    CityMapjava 文件里:
    
    package com.tanzhou.util;
    
    import java.util.LinkedHashMap;
    import java.util.Map;
    
    import javax.tools.JavaCompiler;
    
    /**
     * 城市数据的组织类
     * @author Ming
     * @version 1.0
     * 2015-2-7
     *
     */
    public class CityMap implements java.io.Serializable{
    
        /**
         * 全国(省,直辖市,自治区,特别行政区)映射集合
         */
        public static Map<String, String[]> model = new LinkedHashMap<String, String[]>();
        
        static{
               
                model.put("上海", new String[]{"上海"});
                model.put("北京", new String[]{"北京"});
                model.put("天津", new String[]{"天津"});
                model.put("重庆", new String[]{"重庆"});
                model.put("黑龙江", new String[]{"哈尔滨","齐齐哈尔","牡丹江","大庆","伊春","双鸭山","鹤岗","鸡西","佳木斯","七台河","黑河","绥化","大兴安岭"});
                model.put("吉林", new String[]{"长春","延边","吉林","白山","白城","四平","松原","辽源","大安","通化"});
                model.put("辽宁", new String[]{"沈阳","大连","葫芦岛","旅顺","本溪","抚顺","铁岭","辽阳","营口","阜新","朝阳","锦州","丹东","鞍山"});
                model.put("内蒙古", new String[]{"呼和浩特","呼伦贝尔","锡林浩特","包头","赤峰","海拉尔","乌海","鄂尔多斯","通辽"});
                model.put("河北", new String[]{"石家庄","唐山","张家口","廊坊","邢台","邯郸","沧州","衡水","承德","保定","秦皇岛"});
                model.put("河南", new String[]{"郑州","开封","洛阳","平顶山","焦作","鹤壁","新乡","安阳","濮阳","许昌","漯河","三门峡","南阳","商丘","信阳","周口","驻马店"});
                model.put("山东", new String[]{"济南","青岛","淄博","威海","曲阜","临沂","烟台","枣庄","聊城","济宁","菏泽","泰安","日照","东营","德州","滨州","莱芜","潍坊"});
                model.put("山西", new String[]{"太原","阳泉","晋城","晋中","临汾","运城","长治","朔州","忻州","大同","吕梁"});
                model.put("江苏", new String[]{"南京","苏州","昆山","南通","太仓","吴县","徐州","宜兴","镇江","淮安","常熟","盐城","泰州","无锡","连云港","扬州","常州","宿迁"});
                model.put("安徽", new String[]{"合肥","巢湖","蚌埠","安庆","六安","滁州","马鞍山","阜阳","宣城","铜陵","淮北","芜湖","毫州","宿州","淮南","池州"});
                model.put("陕西", new String[]{"西安","韩城","安康","汉中","宝鸡","咸阳","榆林","渭南","商洛","铜川","延安"});
                model.put("宁夏", new String[]{"银川","固原","中卫","石嘴山","吴忠"});
                model.put("甘肃", new String[]{"兰州","白银","庆阳","酒泉","天水","武威","张掖","甘南","临夏","平凉","定西","金昌"});
                model.put("青海", new String[]{"西宁","海北","海西","黄南","果洛","玉树","海东","海南"});
                model.put("湖北", new String[]{"武汉","宜昌","黄冈","恩施","荆州","神农架","十堰","咸宁","襄樊","孝感","随州","黄石","荆门","鄂州"});
                model.put("湖南", new String[]{"长沙","邵阳","常德","郴州","吉首","株洲","娄底","湘潭","益阳","永州","岳阳","衡阳","怀化","韶山","张家界"});
                model.put("浙江", new String[]{"杭州","湖州","金华","宁波","丽水","绍兴","雁荡山","衢州","嘉兴","台州","舟山","温州"});
                model.put("江西", new String[]{"南昌","萍乡","九江","上饶","抚州","吉安","鹰潭","宜春","新余","景德镇","赣州"});
                model.put("福建", new String[]{"福州","厦门","龙岩","南平","宁德","莆田","泉州","三明","漳州"});
                model.put("贵州", new String[]{"贵阳","安顺","赤水","遵义","铜仁","六盘水","毕节","凯里","都匀"});
                model.put("四川", new String[]{"成都","泸州","内江","凉山","阿坝","巴中","广元","乐山","绵阳","德阳","攀枝花","雅安","宜宾","自贡","甘孜州","达州","资阳","广安","遂宁","眉山","南充"});
                model.put("广东", new String[]{"广州","深圳","潮州","韶关","湛江","惠州","清远","东莞","江门","茂名","肇庆","汕尾","河源","揭阳","梅州","中山","德庆","阳江","云浮","珠海","汕头","佛山"});
                model.put("广西", new String[]{"南宁","桂林","阳朔","柳州","梧州","玉林","桂平","贺州","钦州","贵港","防城港","百色","北海","河池","来宾","崇左"});
                model.put("云南", new String[]{"昆明","保山","楚雄","德宏","红河","临沧","怒江","曲靖","思茅","文山","玉溪","昭通","丽江","大理"});
                model.put("海南", new String[]{"海口","三亚","儋州","琼山","通什","文昌"});
                model.put("新疆", new String[]{"乌鲁木齐","阿勒泰","阿克苏","昌吉","哈密","和田","喀什","克拉玛依","石河子","塔城","库尔勒","吐鲁番","伊宁"});        
        }
        
    }
    
    ///////////////////////////////////////////////////////////////////////////
    
    typeService.jsp文件里:
    
    <%@page import="com.tanzhou.util.CityMap"%>
    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <%
      // 通过省份名称 获取 市级 名称
      request.setCharacterEncoding("UTF-8");
      String type = request.getParameter("type"); // type  index.jsp页面传过来的 省份名称 
      System.out.println("===:"+type);
      String[] citys = CityMap.model.get(type); // 通过key 获取value ;citys 装载的就是一个省份下的所有市
    %>
    
    <select name="typeID" id="typeID">
    <%
      for(String city : citys){
    %>
       <option value='<%= city%>'><%= city%></option>
    <% } %>
    </select>
    
    
    ////////////////////////////////////////////////////////////////////
    
    index.jsp文件里:
    
    
    <%@page import="com.tanzhou.util.CityMap,java.util.*"%>
    <%@page contentType="text/html"  pageEncoding="UTF-8"%>
    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
            <title>使用AJAX级联选择框实现省市关联</title>
        </head>
        <script language="javascript">
            
            var xmlHttp;
          //创建XMLHttpRequest
            function createXMLHttpRequest(){ 
                // 初始化对象并发出XMLHttpRequest请求
                xmlHttp = false;
                if(window.XMLHttpRequest){ // 获取其他除IE以外的浏览器
                    xmlHttp = new XMLHttpRequest();
                }else if(window.ActiveXObject){ // IE浏览器
                    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
                }
            }  
        
            function getCity(type){
                //alert(type);
                
                // 1、创建XMLHttpRequest
                createXMLHttpRequest();
                // 2、回调函数
                xmlHttp.onreadystatechange =insertContents;
                // 3、呼叫服务器
                xmlHttp.open("POST", "typeService.jsp", true);
                xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
                // 4、发送请求道服务器
                xmlHttp.send("type="+type);
            }
            
            // 回调函数
            function insertContents(){
                if(xmlHttp.readyState==4){
                    if(xmlHttp.status==200){
                        alert(xmlHttp.responseText);
                        subType.innerHTML = xmlHttp.responseText; // text  ,xml  ,json  html
                    }else{
                        alert('您请求的页面发现错误!');
                    }
                }
            }
            
        </script>
       
        <body>
            <table width="600"  border="0" align="center" cellpadding="-2" cellspacing="-2" bordercolordark="#FFFFFF">
                <form action="" method="post" name="form1">
                    <tr>
                        <td width="20%" height="27">联系地址:</td>
                        <td height="27" colspan="3">&nbsp;
                            <input type="text" id="address" size="58">
                        &nbsp;&nbsp; </td>
                    </tr>
                    <tr>
                        <td height="27">选择省:</td>
                        <td width="35%" height="27">&nbsp;
                            <select id="type" onchange="getCity(this.value)">
                              <%
                             Set<String> keys = CityMap.model.keySet(); // 获取LinkedHashMap容器的所有key值
                             for(String key:keys){
                                 out.println("<option value='"+key+"'>"+key+"</option>");
                             }
                             %>
                            </select></td>
                        <td width="18%" height="27">选择城市:</td>
                        <td width="42%" height="27" id="subType">&nbsp;</td>
                    </tr>
                    <tr>
                        <td height="41">联系电话:</td>
                        <td height="41">&nbsp;
                            <input type="text" id="phone">
                        </td>
                        <td height="41">联系人:</td>
                        <td height="41">
                            <input size="8" type="text" id="linkMan">
                        </td>
                    </tr>
                    <tr>
                        <td height="103">附言:</td>
                        <td colspan="3">
                            <textarea cols="45" rows="5" id="introduce"></textarea>
                        </td>
                    </tr>
                    <tr>
                        <td height="28" colspan="4" align="center">
                            <input type="button" value="提交" onClick="mycheck();">
                            &nbsp;
                            <input type="reset" value="重置">
                        &nbsp;</td>
                    </tr>
                </form>
            </table>
           <script language="javascript">
                getCity(form1.type.value);
           </script>
        </body>
    </html>
  • 相关阅读:
    Roslyn 语法树中的各种语法节点及每个节点的含义
    WPF 使用 WindowChrome,在自定义窗口标题栏的同时最大程度保留原生窗口样式(类似 UWP/Chrome)
    在制作跨平台的 NuGet 工具包时,如何将工具(exe/dll)的所有依赖一并放入包中
    如何在 .NET 库的代码中判断当前程序运行在 Debug 下还是 Release 下
    像黑客一样!Chrome 完全键盘操作指南(原生快捷键 + Vimium 插件)
    .NET 使用 XPath 来读写 XML 文件
    XML 的 XPath 语法
    WPF 中使用附加属性,将任意 UI 元素或控件裁剪成圆形(椭圆)
    Windows 10 四月更新,文件夹名称也能区分大小写?
    C#/.NET 中推荐的 Dispose 模式的实现
  • 原文地址:https://www.cnblogs.com/Deng1185246160/p/4279744.html
Copyright © 2020-2023  润新知