技术标签 TAGS
专业技术精选
- 2020-03-20非常不错的骰子案例
- 2019-05-26vscode git and gitlens中文乱码问题
- 2011-12-14什么是网站制作的web标准
- 2011-12-14上海网站建设之六大不利优化因素
联动菜单中国地区jquery
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>联动菜单jquery</title>
<script src="js/jquery-1.4.2.min.js" type="text/javascript"></script>
<style type="text/css">
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"></head>
<script type="text/javascript">
$(function(){
var arrArea = [{
'shanghai': {
name: '上海',
city: {
'pudong': '浦东区',
'putuo': '普陀区',
'yangpu': '杨浦区 '
}
},
'jiangsu': {
name: '江苏',
city: {
'pudong': '苏州',
'putuo': '南京',
'yangpu': '盐城'
}
},
'zhejiang': {
name: '浙江',
city: {
'pudong': '杭州',
'putuo': '温州',
'yangpu': '宁波 '
}
}
}];
//alert(arrArea[0].shanghai.city['pudong'])
var jQ_selectItem = $('#J_selectItem');
$('select[name=province]', jQ_selectItem).change(function(){
var self = $(this);
var i = 0;
var self_province = self.val();
$.each(arrArea[0][self_province].city, function(k, n){
$('select[name=city]', jQ_selectItem)[0].options[i++] = new Option(n,k);
});
});
});
</script>
<body>
<div class="selectItem" id="J_selectItem">
<select name="province">
<option value="shanghai">上海</option>
<option value="zhejiang">浙江</option>
<option value="jiangsu">江苏</option>
</select>
<select name="city">
<option value="">--</option>
</select>
<select name="county">
<option value="">--</option>
</select>
</div>
</body>
</html>