[TOC] ## 一、城市數據 下載JS數據： > 鏈接: https://pan.baidu.com/s/1AXuWu05OOlkGBIjZEmfAOA 提取碼: 9yy1 ``` var city = [{"name":"\u5317\u4eac","child":["\u4e1c\u57ce","\u897f\u57ce","\u5d07\u6587","\u5ba3\u6b66","\u671d\u9633","\u77f3\u666f\u5c71","\u6d77\u6dc0","\u95e8\u5934\u6c9f","\u623f\u5c71","\u901a\u5dde","\u987a\u4e49","\u660c\u5e73","\u5927\u5174","\u6000\u67d4","\u5e73\u8c37","\u5bc6\u4e91","\u5ef6\u5e86"]},{"name":"\u5929\u6d25","child":["\u548c\u5e73","\u6cb3\u4e1c","\u6cb3\u897f","\u5357\u5f00","\u6cb3\u5317","\u7ea2\u6865","\u5858\u6cbd","\u6c49\u6cbd","\u5927\u6e2f","\u4e1c\u4e3d","\u897f\u9752","\u6d25\u5357","\u5317\u8fb0","\u6b66\u6e05","\u5b9d\u577b","\u5b81\u6cb3","\u9759\u6d77","\u84df\u53bf"]},{"name":"\u4e0a\u6d77","child":["\u9ec4\u6d66","\u5362\u6e7e","\u5f90\u6c47","\u957f\u5b81","\u9759\u5b89","\u666e\u9640","\u95f8\u5317","\u8679\u53e3","\u6768\u6d66","\u95f5\u884c","\u5b9d\u5c71","\u5609\u5b9a","\u6d66\u4e1c\u65b0","\u91d1\u5c71","\u677e\u6c5f","\u9752\u6d66","\u5357\u6c47","\u5949\u8d24","\u5d07\u660e"]},{"name":"\u91cd\u5e86","child":["\u4e07\u5dde","\u6daa\u9675","\u6e1d\u4e2d","\u5927\u6e21\u53e3","\u6c5f\u5317","\u6c99\u576a\u575d","\u4e5d\u9f99\u5761","\u5357\u5cb8","\u5317\u789a","\u4e07\u76db","\u53cc\u6865","\u6e1d\u5317","\u5df4\u5357","\u9ed4\u6c5f","\u957f\u5bff","\u7da6\u6c5f","\u6f7c\u5357","\u94dc\u6881","\u5927\u8db3","\u8363\u660c","\u74a7\u5c71","\u6881\u5e73","\u57ce\u53e3","\u4e30\u90fd","\u57ab\u6c5f","\u6b66\u9686","\u5fe0\u53bf","\u5f00\u53bf","\u4e91\u9633","\u5949\u8282","\u5deb\u5c71","\u5deb\u6eaa","\u77f3\u67f1","\u79c0\u5c71","\u9149\u9633","\u5f6d\u6c34","\u6c5f\u6d25","\u5408\u5ddd","\u6c38\u5ddd","\u5357\u5ddd"]},{"name":"\u6cb3\u5317","child":["\u4fdd\u5b9a","\u6ca7\u5dde","\u627f\u5fb7","\u5b9a\u5dde","\u9986\u9676","\u90af\u90f8","\u8861\u6c34","\u5eca\u574a","\u79e6\u7687\u5c9b","\u77f3\u5bb6\u5e84","\u5510\u5c71","\u90a2\u53f0","\u5f20\u5bb6\u53e3","\u6b63\u5b9a","\u8d75\u53bf","\u5f20\u5317"]},{"name":"\u6cb3\u5357","child":["\u5b89\u9633","\u957f\u845b","\u9e64\u58c1","\u7126\u4f5c","\u6d4e\u6e90","\u5f00\u5c01","\u6d1b\u9633","\u6f2f\u6cb3","\u660e\u6e2f","\u5357\u9633","\u5e73\u9876\u5c71","\u6fee\u9633","\u5546\u4e18","\u4e09\u95e8\u5ce1","\u65b0\u4e61","\u8bb8\u660c","\u4fe1\u9633","\u79b9\u5dde","\u9122\u9675","\u90d1\u5dde","\u5468\u53e3","\u9a7b\u9a6c\u5e97"]},{"name":"\u9ed1\u9f99\u6c5f","child":["\u5927\u5e86","\u5927\u5174\u5b89\u5cad","\u54c8\u5c14\u6ee8","\u9e64\u5c97","\u9ed1\u6cb3","\u4f73\u6728\u65af","\u9e21\u897f","\u7261\u4e39\u6c5f","\u9f50\u9f50\u54c8\u5c14","\u4e03\u53f0\u6cb3","\u7ee5\u5316","\u53cc\u9e2d\u5c71","\u4f0a\u6625"]},{"name":"\u5409\u6797","child":["\u767d\u57ce","\u767d\u5c71","\u957f\u6625","\u5409\u6797","\u8fbd\u6e90","\u677e\u539f","\u56db\u5e73","\u901a\u5316","\u5ef6\u8fb9"]},{"name":"\u8fbd\u5b81","child":["\u978d\u5c71","\u672c\u6eaa","\u671d\u9633","\u5927\u8fde","\u4e39\u4e1c","\u629a\u987a","\u961c\u65b0","\u846b\u82a6\u5c9b","\u9526\u5dde","\u8fbd\u9633","\u76d8\u9526","\u6c88\u9633","\u94c1\u5cad","\u74e6\u623f\u5e97","\u8425\u53e3"]},{"name":"\u5c71\u4e1c","child":["\u6ee8\u5dde","\u5fb7\u5dde","\u4e1c\u8425","\u83cf\u6cfd","\u6d4e\u5357","\u6d4e\u5b81","\u57a6\u5229","\u4e34\u6c82","\u804a\u57ce","\u83b1\u829c","\u9752\u5c9b","\u65e5\u7167","\u6cf0\u5b89","\u6f4d\u574a","\u5a01\u6d77","\u70df\u53f0","\u6dc4\u535a","\u67a3\u5e84","\u7ae0\u4e18","\u8bf8\u57ce"]},{"name":"\u5185\u8499\u53e4","child":["\u963f\u62c9\u5584\u76df","\u5305\u5934","\u5df4\u5f66\u6dd6\u5c14\u76df","\u8d64\u5cf0","\u9102\u5c14\u591a\u65af","\u547c\u548c\u6d69\u7279","\u547c\u4f26\u8d1d\u5c14","\u6d77\u62c9\u5c14","\u901a\u8fbd","\u4e4c\u6d77","\u4e4c\u5170\u5bdf\u5e03","\u9521\u6797\u90ed\u52d2\u76df","\u5174\u5b89\u76df"]},{"name":"\u6c5f\u82cf","child":["\u5e38\u5dde","\u5927\u4e30","\u6dee\u5b89","\u8fde\u4e91\u6e2f","\u5357\u4eac","\u5357\u901a","\u82cf\u5dde","\u5bbf\u8fc1","\u6cf0\u5dde","\u65e0\u9521","\u5f90\u5dde","\u626c\u5dde","\u76d0\u57ce","\u9547\u6c5f"]},{"name":"\u5b89\u5fbd","child":["\u5b89\u5e86","\u868c\u57e0","\u4eb3\u5dde","\u5de2\u6e56","\u6c60\u5dde","\u6ec1\u5dde","\u961c\u9633","\u5408\u80a5","\u6dee\u5357","\u6dee\u5317","\u9ec4\u5c71","\u548c\u53bf","\u970d\u90b1","\u516d\u5b89","\u9a6c\u978d\u5c71","\u5bbf\u5dde","\u94dc\u9675","\u6850\u57ce","\u829c\u6e56","\u5ba3\u57ce"]},{"name":"\u5c71\u897f","child":["\u957f\u6cbb","\u5927\u540c","\u664b\u57ce","\u664b\u4e2d","\u5415\u6881","\u4e34\u6c7e","\u4e34\u7317","\u6e05\u5f90","\u6714\u5dde","\u592a\u539f","\u5ffb\u5dde","\u8fd0\u57ce","\u9633\u6cc9"]},{"name":"\u9655\u897f","child":["\u5b89\u5eb7","\u5b9d\u9e21","\u6c49\u4e2d","\u5546\u6d1b","\u94dc\u5ddd","\u6e2d\u5357","\u897f\u5b89","\u54b8\u9633","\u5ef6\u5b89","\u6986\u6797"]},{"name":"\u7518\u8083","child":["\u767d\u94f6","\u5b9a\u897f","\u7518\u5357","\u91d1\u660c","\u5609\u5cea\u5173","\u9152\u6cc9","\u5170\u5dde","\u4e34\u590f","\u9647\u5357","\u5e73\u51c9","\u5e86\u9633","\u5929\u6c34","\u6b66\u5a01","\u5f20\u6396"]},{"name":"\u6d59\u6c5f","child":["\u676d\u5dde","\u6e56\u5dde","\u5609\u5174","\u91d1\u534e","\u4e3d\u6c34","\u5b81\u6ce2","\u8862\u5dde","\u7ecd\u5174","\u53f0\u5dde","\u6e29\u5dde","\u4e49\u4e4c","\u821f\u5c71"]},{"name":"\u6c5f\u897f","child":["\u629a\u5dde","\u8d63\u5dde","\u4e5d\u6c5f","\u5409\u5b89","\u666f\u5fb7\u9547","\u5357\u660c","\u840d\u4e61","\u4e0a\u9976","\u65b0\u4f59","\u9e70\u6f6d","\u5b9c\u6625","\u6c38\u65b0"]},{"name":"\u6e56\u5317","child":["\u6069\u65bd","\u9102\u5dde","\u9ec4\u77f3","\u9ec4\u5188","\u8346\u5dde","\u8346\u95e8","\u6f5c\u6c5f","\u5341\u5830","\u795e\u519c\u67b6","\u968f\u5dde","\u5929\u95e8","\u6b66\u6c49","\u8944\u9633","\u5b5d\u611f","\u4ed9\u6843","\u54b8\u5b81","\u5b9c\u660c"]},{"name":"\u6e56\u5357","child":["\u957f\u6c99","\u5e38\u5fb7","\u90f4\u5dde","\u8861\u9633","\u6000\u5316","\u5a04\u5e95","\u90b5\u9633","\u6e58\u6f6d","\u6e58\u897f","\u5cb3\u9633","\u6c38\u5dde","\u76ca\u9633","\u682a\u6d32","\u5f20\u5bb6\u754c"]},{"name":"\u8d35\u5dde","child":["\u5b89\u987a","\u6bd5\u8282","\u8d35\u9633","\u516d\u76d8\u6c34","\u9ed4\u4e1c\u5357","\u9ed4\u5357","\u9ed4\u897f\u5357","\u94dc\u4ec1","\u9075\u4e49"]},{"name":"\u56db\u5ddd","child":["\u963f\u575d","\u5df4\u4e2d","\u6210\u90fd","\u5fb7\u9633","\u8fbe\u5dde","\u5e7f\u5b89","\u5e7f\u5143","\u7518\u5b5c","\u4e50\u5c71","\u6cf8\u5dde","\u51c9\u5c71","\u7ef5\u9633","\u7709\u5c71","\u5185\u6c5f","\u5357\u5145","\u6500\u679d\u82b1","\u9042\u5b81","\u5b9c\u5bbe","\u96c5\u5b89","\u81ea\u8d21","\u8d44\u9633"]},{"name":"\u4e91\u5357","child":["\u4fdd\u5c71","\u695a\u96c4","\u5927\u7406","\u8fea\u5e86","\u5fb7\u5b8f","\u7ea2\u6cb3","\u6606\u660e","\u4e3d\u6c5f","\u4e34\u6ca7","\u6012\u6c5f","\u666e\u6d31","\u66f2\u9756","\u6587\u5c71","\u897f\u53cc\u7248\u7eb3","\u7389\u6eaa","\u662d\u901a"]},{"name":"\u65b0\u7586","child":["\u963f\u514b\u82cf","\u963f\u62c9\u5c14","\u5df4\u97f3\u90ed\u695e","\u535a\u5c14\u5854\u62c9","\u660c\u5409","\u54c8\u5bc6","\u548c\u7530","\u514b\u62c9\u739b\u4f9d","\u5e93\u5c14\u52d2","\u5580\u4ec0","\u514b\u5b5c\u52d2\u82cf","\u77f3\u6cb3\u5b50","\u5410\u9c81\u756a","\u56fe\u6728\u8212\u514b","\u4e4c\u9c81\u6728\u9f50","\u4e94\u5bb6\u6e20","\u4f0a\u7281","\u5854\u57ce","\u963f\u52d2\u6cf0"]},{"name":"\u5b81\u590f","child":["\u56fa\u539f","\u77f3\u5634\u5c71","\u5434\u5fe0","\u94f6\u5ddd","\u4e2d\u536b"]},{"name":"\u9752\u6d77","child":["\u679c\u6d1b","\u9ec4\u5357","\u6d77\u897f","\u6d77\u4e1c","\u6d77\u5317","\u6d77\u5357","\u897f\u5b81","\u7389\u6811"]},{"name":"\u897f\u85cf","child":["\u963f\u91cc","\u660c\u90fd","\u62c9\u8428","\u6797\u829d","\u90a3\u66f2","\u65e5\u5580\u5219","\u5c71\u5357"]},{"name":"\u5e7f\u897f","child":["\u767e\u8272","\u5317\u6d77","\u5d07\u5de6","\u9632\u57ce\u6e2f","\u6842\u6797","\u8d35\u6e2f","\u6cb3\u6c60","\u8d3a\u5dde","\u67f3\u5dde","\u6765\u5bbe","\u5357\u5b81","\u94a6\u5dde","\u68a7\u5dde","\u7389\u6797"]},{"name":"\u5e7f\u4e1c","child":["\u6f6e\u5dde","\u4e1c\u839e","\u4f5b\u5c71","\u5e7f\u5dde","\u60e0\u5dde","\u6cb3\u6e90","\u6c5f\u95e8","\u63ed\u9633","\u8302\u540d","\u6885\u5dde","\u6e05\u8fdc","\u987a\u5fb7","\u6df1\u5733","\u6c55\u5934","\u97f6\u5173","\u6c55\u5c3e","\u53f0\u5c71","\u9633\u6c5f","\u9633\u6625","\u4e91\u6d6e","\u73e0\u6d77","\u4e2d\u5c71","\u6e5b\u6c5f","\u8087\u5e86"]},{"name":"\u798f\u5efa","child":["\u798f\u5dde","\u9f99\u5ca9","\u5b81\u5fb7","\u5357\u5e73","\u8386\u7530","\u6cc9\u5dde","\u4e09\u660e","\u6b66\u5937\u5c71","\u53a6\u95e8","\u6f33\u5dde"]},{"name":"\u6d77\u5357","child":["\u6d77\u53e3","\u4e09\u4e9a","\u4e94\u6307\u5c71"]},{"name":"\u53f0\u6e7e","child":["\u53f0\u5317\u5e02","\u9ad8\u96c4\u5e02","\u57fa\u9686\u5e02","\u53f0\u4e2d\u5e02","\u53f0\u5357\u5e02","\u65b0\u7af9\u5e02","\u5609\u4e49\u5e02","\u65b0\u5317\u5e02","\u5b9c\u5170\u53bf","\u6843\u56ed\u53bf","\u65b0\u7af9\u53bf","\u82d7\u6817\u53bf","\u53f0\u4e2d\u53bf","\u5f70\u5316\u53bf","\u5357\u6295\u53bf","\u4e91\u6797\u53bf","\u5609\u4e49\u53bf","\u53f0\u5357\u53bf","\u9ad8\u96c4\u53bf","\u5c4f\u4e1c\u53bf","\u6f8e\u6e56\u53bf","\u53f0\u4e1c\u53bf","\u82b1\u83b2\u53bf"]},{"name":"\u9999\u6e2f","child":["\u4e2d\u897f\u533a","\u4e1c\u533a","\u4e5d\u9f99\u57ce\u533a","\u89c2\u5858\u533a","\u5357\u533a","\u6df1\u6c34\u57d7\u533a","\u9ec4\u5927\u4ed9\u533a","\u6e7e\u4ed4\u533a","\u6cb9\u5c16\u65fa\u533a","\u79bb\u5c9b\u533a","\u8475\u9752\u533a","\u5317\u533a","\u897f\u8d21\u533a","\u6c99\u7530\u533a","\u5c6f\u95e8\u533a","\u5927\u57d4\u533a","\u8343\u6e7e\u533a","\u5143\u6717\u533a"]},{"name":"\u6fb3\u95e8","child":["\u82b1\u5730\u739b\u5802\u533a","\u5723\u5b89\u591a\u5c3c\u5802\u533a","\u5927\u5802\u533a","\u671b\u5fb7\u5802\u533a","\u98ce\u987a\u5802\u533a","\u6c39\u4ed4","\u8def\u73af"]},{"name":"\u5176\u4ed6","child":["\u4e0d\u9650"]}]; ``` ## 二、動態實現 ``` $(function () { //修改資料選項卡 $('#sel-edit li').click( function () { var index = $(this).index(); $(this).addClass('edit-cur').siblings().removeClass('edit-cur'); $('.form').hide().eq(index).show(); } ); //城市聯動 var province = ''; $.each(city, function (i, k) { province += '<option value="' + k.name + '" index="' + i + '">' + k.name + '</option>'; }); $('select[name=province]').append(province).change(function () { var option = ''; if ($(this).val() == '') { option += '<option value="">請選擇</option>'; } else { var index = $(':selected', this).attr('index'); var data = city[index].child; for (var i = 0; i < data.length; i++) { option += '<option value="' + data[i] + '">' + data[i] + '</option>'; } } $('select[name=city]').html(option); }); //所在地默認選項 address = address.split(' '); $('select[name=province]').val(address[0]); $.each(city, function (i, k) { if (k.name == address[0]) { var str = ''; for (var j in k.child) { str += '<option value="' + k.child[j] + '" '; if (k.child[j] == address[1]) { str += 'selected="selected"'; } str += '>' + k.child[j] + '</option>'; } $('select[name=city]').html(str); } }); //星座默認選項 $('select[name=night]').val(constellation); //頭像上傳 Uploadify 插件 $('#face').uploadify({ swf : PUBLIC + '/Uploadify/uploadify.swf', //引入Uploadify核心Flash文件 uploader : uploadUrl, //PHP處理腳本地址 width : 120, //上傳按鈕寬度 height : 30, //上傳按鈕高度 buttonImage : PUBLIC + '/Uploadify/browse-btn.png', //上傳按鈕背景圖地址 fileTypeDesc : 'Image File', //選擇文件提示文字 fileTypeExts : '*.jpeg; *.jpg; *.png; *.gif', //允許選擇的文件類型 formData : {'session_id' : sid}, //上傳成功后的回調函數 onUploadSuccess : function (file, data, response) { eval('var data = ' + data); if (data.status) { $('#face-img').attr('src', ROOT + '/Uploads/Face/' + data.path.max); $('input[name=face180]').val(data.path.max); $('input[name=face80]').val(data.path.medium); $('input[name=face50]').val(data.path.mini); } else { alert(data.msg); } } }); //jQuery Validate 表單驗證 /** * 添加驗證方法 * 以字母開頭，5-17 字母、數字、下劃線"_" */ jQuery.validator.addMethod("user", function(value, element) { var tel = /^[a-zA-Z][\w]{4,16}$/; return this.optional(element) || (tel.test(value)); }, "以字母開頭，5-17 字母、數字、下劃線'_'"); $('form[name=editPwd]').validate({ errorElement : 'span', success : function (label) { label.addClass('success'); }, rules : { old : { required : true, user : true }, new : { required : true, user : true }, newed : { required : true, equalTo : "#new" } }, messages : { old : { required : '請填寫舊密碼', }, new : { required : '請設置新密碼' }, newed : { required : '請確認密碼', equalTo : '兩次密碼不一致' } } }); }); ```