省市二级显示jquery

来源：互联网发布：nba总决赛欧文数据统计编辑：程序博客网时间：2024/05/17 07:24
<!DOCTYPE html><html><head lang="en">    <meta charset="UTF-8">    <title>省市二级联动、分页</title>    <style></style>    <script src="js/jquery-2.2.2.js"></script>    <script>        var pros=[            {'name':'jiangsu','name_cn':'江苏','cities':['苏州','无锡']},            {'name':'gongdong','name_cn':'广东','cities':['广州','深圳']},            {'name':'henan','name_cn':'河南','cities':['濮阳','安阳']},            {'name':'hebei','name_cn':'河北','cities':['北京','邯郸']},            {'name':'fujian','name_cn':'福建','cities':['泉州','厦门']}        ]        $(function(){            for(var i=0;i<pros.length;i++){            //自动加入option                var a=$("<option>");                a.html(pros[i].name_cn);                a.appendTo('#pro');            }            $("#pro").change(function(){                var xz=$("#pro option:selected").index();                var ci= $("#city");                ci.empty();                for(var j=0;j<pros[xz].cities.length;j++){                    var b=$("<option>");                    b.html(pros[xz].cities[j]);                    b.appendTo('#city');                }            });        })    </script></head><body><select name="province" id="pro"></select><select name="city" id="city"></select></body></html>
0 0