zoukankan      html  css  js  c++  java
  • 城市列表联动

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript" src="js/jquery-1.8.3.js" ></script>
    <script>
    var arr=[["武汉","黄冈","襄阳","小米"],["长沙","韶山","岳阳楼","张家界"],["商丘","郑州","南阳","信阳"]]
    $(function(){
    var city=new Array(3);
    city[0]=new Array("武汉","黄冈","襄阳","小米");
    city[1]=new Array("长沙","韶山","岳阳楼","张家界");
    city[2]=new Array("石家庄","唐山","保定","廊坊");
    city[3]=new Array("商丘","郑州","南阳","信阳");
    $("#province").change(function(){
    $("#city").empty();
    var val=this.value;
    console.log(val);
    $.each(city,function(i,n){
    if(val==i){
    $.each(city[i],function(j,m){
    var txt=document.createTextNode(m);
    var op=document.createElement("option");
    $(op).append(txt);
    $(op).appendTo("#city")
    });
    }
    });
    });
    });
    </script>
    </head>
    <body>
    <select id="province">
    <option>===请选择===</option>
    <option value="0">湖北</option>
    <option value="1">湖南</option>
    <option value="2">河北</option>
    <option value="3">河南</option>
    </select>
    <select id="city">
    <option>===请选择===</option>
    </select>
    </body>
    </html>

  • 相关阅读:
    js optional chaining operator
    Linux Bash Script conditions
    Linux Bash Script loop
    js Nullish Coalescing Operator
    js sort tricks All In One
    React Portal All In One
    最小生成树&&次小生成树
    链式前向星实现以及它的遍历
    [2015.11.8|9图论]解题代码集合
    最短路算法及其延伸
  • 原文地址:https://www.cnblogs.com/xuaima/p/10479469.html
Copyright © 2011-2022 走看看