欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

顺丰原生地址库封装

程序员文章站 2022-09-13 23:31:18
demo 省: 市: 区: ......
<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>demo</title>
    <script type="text/javascript" src="region_data.js"></script>
    <script type="text/javascript" src="jquery-3.3.1.min.js"></script>
</head>
<body>
    省:<select name="province" id="province"></select>
    市:<select name="city" id="city"></select>
    区:<select name="county" id="county"></select>
    <script type="text/javascript">
    	var data = json.parse(region_data);
        var option = "<option value='请选择'>请选择</option>";
        $("#province").html(option);
        $("#city").html(option);
        $("#county").html(option);
        // 生成省列表
        for(var i=0;i<data[0].length;i++){
        	var str_province = data[0][i].split(":");
			var p_val = str_province[0];
            var option_province= '<option value ='+ data[0][i] +'>' + p_val +'</option>' ;
            $("#province").append(option_province);
        }
        $("#province").change(function(e){
        	var index = $(this).children('option:selected').index() - 1;
			$("#city").html('');
			$("#county").html('');
        	$.each(data[1][index], function (index, value) { 
        		var str_city = value.split(":");
				var c_val = str_city[0];
				var option_city1= '<option>请选择</option>' ;
				if(index == 0){
 					$("#city").append(option_city1); 
				}
       			var option_city= '<option value ='+ value +'>' + c_val +'</option>' ;
 				 $("#city").append(option_city); 
           });
		});

        $('#city').change(function(s){
        	$("#county").html('');
			var i = $(this).children('option:selected').index() - 1;
			var city_val = $(this).children('option:selected').val();
			var str = city_val.split(":");
			var i = str[2];
        	$.each(data[2][i], function (i, v) { 
        		var str_county = v.split(":");
				var co_val = str_county[0];
				var option_county1= '<option>请选择</option>' ;
				if(i == 0){
 					$("#county").append(option_county1); 
				}
       			var option_county= '<option value ='+ v +'>' + co_val +'</option>' ;
 				 $("#county").append(option_county); 
           });
        });
    </script>
</body>
</html>