jQuery省市联动

最新推荐文章于 2022-04-12 21:44:07 发布

dxm809

最新推荐文章于 2022-04-12 21:44:07 发布

阅读量110

点赞数

分类专栏： JQuery

JQuery 专栏收录该内容

61 篇文章 2 订阅

订阅专栏

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
<script src="jquery-1.7.1.min.js"></script>
<script>
var datas = {
'广东': ['深圳', '广州'],
'河南': ['郑州', '洛阳'],
'湖北': ['武汉', '宜昌']
}
$(function () {

var province = $('<select></select>').appendTo('body');
province.change(function () {
loadCity();
});
$.each(datas, function (key, value) {
$('<option value="' + key + '">' + key + '</option>').appendTo(province);
});
var city = $('<select></select>').appendTo('body');
loadCity();

function loadCity() {
city.empty();
var citys = datas[province.val()];
$.each(citys, function (index, value) {
$('<option>' + value + '</option>').appendTo(city);
});
}

});
</script>
</head>
<body>

</body>
</html>