jQuery实现三级城市联动

<div id="all">
    <select id="save"></select><!-- 省级 -->
    <select id="city"></select><!-- 市级 -->
    <select id="area"></select><!-- 区级 -->
</div>

<style>
    select{
        width: 100px;
    }

    div{
        width: 500px;
        height: 300px;
        margin:150px auto;
    }
</style>

<script type="text/javascript">
    var arr=new Array();
    //一级目录数据
    var arr1=new Array("北京市","上海市","安徽省","江苏省","江浙省","山东省");
     //二级目录数据 
     var arr2 = new Array();
    arr[0]="东城,西城,崇文,宣武,朝阳,丰台,石景山,海淀,门头沟,房山,通州,顺义,昌平,大兴,平谷,怀柔,密云,延庆";
    arr[1]="黄浦,卢湾,徐汇,长宁,静安,普陀,闸北,虹口,杨浦,闵行,宝山,嘉定,浦东,金山,松江,青浦,南汇,奉贤,崇明";
    arr[2]="合肥,芜湖,蚌埠,马鞍山,淮北,铜陵,安庆,黄山,滁州,宿州,池州,淮南,巢湖,阜阳,六安,宣城,亳州";
    arr[3]="南京市,苏州市,徐州,扬州,镇江";
    arr[4]="杭州市,宁波市,金华,温州";
    arr[5]="济南,日照,青岛,烟台";
    //三级目录数据
    var  arr3=new Array();
       arr3[0]=new Array();

       arr3[0][0]="东城";//第一个为省 第二个为区
       arr3[0][1]="西城";
       arr3[0][2]="崇文";
       arr3[0][3]="崇文";

       arr3[1]=new Array();  
       arr3[1][0]="黄浦";
       arr3[1][1]="卢湾";

       arr3[2]=new Array();
       arr3[2][0]="蜀山区,高新区,政务区,瑶海区,包河区";
       arr3[2][1]="芜湖,镜湖区,无为";

        $(function(){
            first();
            $("#save").change(function(){
                second();
            })
            $("#city").change(function(){
                third();
            });

        });

        function first(){
            var ff ="";
            for(var i=0; i<arr1.length; i++){
                ff = ff +'<option value="'+i+'">'+arr1[i]+'</option>';
            }
            $("#save").append(ff);

            second();

        }

        function second(){
            $("#city").empty();
            var n=$("#save").val();
            var Arr2=arr[n].split(',');
            var se = "";
            for(var i=0; i<Arr2.length; i++){
                se = se+'<option value="'+i+'">'+Arr2[i]+'</option>';
            }
            $("#city").append(se);

            third();

        }

        function third(){
            $("#area").empty();
            var c = $("#city").val();
            var n=$("#save").val();

            var Arr3=arr3[n][c].split(',');

            var th = "";
            for(var i=0; i<Arr3.length; i++){
                th = th+'<option value="'+i+'">'+Arr3[i]+'</option>'
            }
            $("#area").append(th);

        }
    </script>