Files
smartParsePro/index.html

203 lines
7.1 KiB
HTML
Raw Normal View History

2019-09-12 13:44:29 +08:00
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
2019-09-12 14:50:11 +08:00
<title>地址智能识别</title>
2019-09-17 13:09:21 +08:00
<link rel="icon" type="image/x-icon" href="img/smart.png">
2019-09-12 14:50:11 +08:00
<link rel="stylesheet" href="css/bootstrap.min.css">
2019-09-12 13:51:30 +08:00
<script src="js/jquery.min.js"></script>
2019-09-12 15:08:16 +08:00
<script src="js/pcasCode.js"></script>
<script src="js/zipCode.js"></script>
2019-09-12 13:51:30 +08:00
<script src="js/address_parse.js"></script>
2019-09-12 14:50:11 +08:00
<script src="js/bootstrap.min.js"></script>
2019-09-12 17:44:47 +08:00
<script async defer src="https://buttons.github.io/buttons.js"></script>
2019-09-12 13:44:29 +08:00
<style>
2019-09-12 14:50:11 +08:00
#value .key {
color: #ff5722;
display: inline-block;
width: 111px;
text-align: right;
}
#value .value {
color: #366500;
padding-left: 10px;
}
2019-09-12 13:44:29 +08:00
</style>
</head>
2019-09-12 14:50:11 +08:00
2019-09-12 13:44:29 +08:00
<body>
2019-09-12 14:50:11 +08:00
<div class="page-header">
2019-09-12 17:44:47 +08:00
<h1>地址智能识别 <small>支持省市区街道/姓名/电话/邮编/身份证号码(字母大写)</small>
<a class="github-button" href="https://github.com/wzc570738205/smartParsePro" data-size="large"
data-show-count="true" aria-label="Star wzc570738205/smartParsePro on GitHub">Star</a></h1>
2019-09-12 14:50:11 +08:00
</div>
2019-09-12 18:02:23 +08:00
<div class="alert alert-danger" role="alert">地址、姓名、电话、邮编、身份证号码(字母大写)用空格或者特殊字符分开!!(支持以下数据格式)</div>
<div>特殊字符<code>~!@#$^&*()=|{}':;',\\[\\].<>/?~@#¥……&*()——|{}【】‘;:”“’。,、?-</code></div> <br>
2019-09-12 14:50:11 +08:00
<ol>
2019-09-12 18:02:23 +08:00
<li>广东省珠海市香洲区盘山路28号幸福茶庄,陈景勇13593464918</li>
<li>马云,陕西省西安市雁塔区丈八沟街道高新四路高新大都荟 13593464918</li>
2019-09-12 17:44:47 +08:00
<li>陕西省西安市雁塔区丈八沟街道高新四路高新大都荟710061 刘国良 13593464918 211381198512096810</li>
2019-09-12 18:02:23 +08:00
<li>西安市雁塔区丈八沟街道高新四路高新大都荟710061 刘国良 13593464918 211381198512096810</li>
<li>雁塔区丈八沟街道高新四路高新大都荟710061 刘国良 13593464918 211381198512096810</li>
2019-09-12 14:50:11 +08:00
<li>北京市朝阳区姚家园3楼 13593464918 马云</li>
2019-09-12 18:13:46 +08:00
<li>河北省石家庄市新华区中华北大街68号鹿城商务中心6号楼1413室 150-3569-6956 马云</li>
2019-10-28 15:25:28 +08:00
<li>疆维吾尔自治区乌鲁木齐市沙依巴克区西虹东路463号 150-3569-6956 小红</li>
<li>新疆阿克苏温宿县博孜墩柯尔克孜族乡吾斯塘博村一组306号 150-3569-6956 马云</li>
2019-09-12 14:50:11 +08:00
</ol>
<textarea class="form-control" onchange="getAddress()" cols="50" rows="7" id='textarea'
placeholder="请粘贴你的地址"></textarea>
2019-09-17 12:49:22 +08:00
<h4>省市区街道四级联动</h4>
2019-09-12 17:44:47 +08:00
<form class="form-inline">
<div class="form-group">
<label for="exampleInputName2">省/直辖市</label>
<select class="form-control" id="province">
<option>请选择</option>
</select>
</div>
<div class="form-group">
<label for="exampleInputEmail2"></label>
<select class="form-control" id="city">
<option>请选择</option>
</select>
</div>
<div class="form-group">
<label for="exampleInputEmail2">区/县</label>
<select class="form-control" id="county">
<option>请选择</option>
</select>
</div>
<div class="form-group">
2019-09-20 15:31:01 +08:00
<label for="exampleInputEmail2">镇/乡/街道</label>
2019-09-12 17:44:47 +08:00
<select class="form-control" id="street">
<option>请选择</option>
</select>
</div>
</form>
2019-09-12 13:44:29 +08:00
<div id="value"></div>
</body>
</html>
<script>
function getAddress() {
let parse_list = smart($('#textarea').val())
let html = '';
for (let key in parse_list) {
if (parse_list[key]) {
2019-09-12 14:50:11 +08:00
html += `<p><span class="key">` + key + `</span>:<span class="value">` + parse_list[key] + `</span></p>`
}
}
$('#value').html(html);
$("#province").val(parse_list.provinceCode);
$("#city").val(parse_list.cityCode);
$("#county").val(parse_list.countyCode);
$("#street").val(parse_list.streetCode);
2019-09-12 13:44:29 +08:00
2019-09-12 14:50:11 +08:00
getCity($("#province").val(), parse_list)
getCounty($("#city").val(), parse_list)
getStreet($("#county").val(), parse_list)
}
2019-09-12 17:44:47 +08:00
addressList = pcassCode;
addressList.forEach(item => {
formatAddresList(item, 1, '')
})
let province = '';
addressList.forEach(res => {
province += ` <option value='` + res.code + `'>` + res.name + `</option>`;
})
$("#province").html(province)
getCity($("#province").val())
getCounty($("#city").val())
getStreet($("#county").val())
2019-09-12 14:50:11 +08:00
$("#province").change(res => {
let provinceCode = $("#province").val();
getCity(provinceCode);
getCounty($("#city").val())
getStreet($("#county").val())
})
$("#city").change(res => {
let cityCode = $("#city").val();
getCounty(cityCode);
getStreet($("#county").val())
})
$("#county").change(res => {
let countyCode = $("#county").val();
getStreet(countyCode);
})
function getCity(provinceCode, parse_list) {
let cityList = [];
let city = '';
addressList.forEach(res => {
if (res.code == provinceCode) {
cityList = res.children;
return;
2019-09-12 13:44:29 +08:00
}
2019-09-12 14:50:11 +08:00
})
cityList.forEach(res => {
city += ` <option value='` + res.code + `'>` + res.name + `</option>`;
})
$("#city").html(city);
if (parse_list) {
$("#city").val(parse_list.cityCode);
}
}
function getCounty(cityCode, parse_list) {
let countyList = [];
let county = '';
addressList.forEach(el => {
el.children.forEach(res => {
if (res.code == cityCode) {
countyList = res.children;
return;
}
})
})
countyList.forEach(res => {
county += ` <option value='` + res.code + `'>` + res.name + `</option>`;
})
$("#county").html(county)
if (parse_list) {
$("#county").val(parse_list.countyCode);
}
}
function getStreet(countyCode, parse_list) {
let streetList = [];
let street = '';
addressList.forEach(el => {
el.children.forEach(element => {
element.children.forEach(res => {
if (res.code == countyCode) {
streetList = res.children;
return;
}
})
})
})
streetList.forEach(res => {
street += ` <option value='` + res.code + `'>` + res.name + `</option>`;
})
$("#street").html(street)
if (parse_list) {
$("#street").val(parse_list.streetCode);
2019-09-12 13:44:29 +08:00
}
}
</script>