<html>
<head>
<title>Linkage_menu</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var city=["hebei","henan","shandong"];
$.each(city,function(i,item){
$(".city").append("<option value='"+i+"'>"+this+"</option>");
});
var hebei_country=["shijiazhuang","baoding"];
var henan_country=["zhengzhou","kaifeng","puyang"];
var shandong_country=["jinan","qingdao","yantai"];
var country=[];
$(".city").change(function(){
var city=$(".city").val();
if(city==0){
country=$.extend([],hebei_country);
}
if(city==1){
country=$.extend([],henan_country);
}
if(city==2){
country=$.extend([],shandong_country);
}
if(city==""||city==null||city==undefined){
country=["Please choose country"];
}
console.log("country",country);
$(".country").html("");
$.each(country,function(i,n){
$(".country").append("<option value='"+i+"'>"+this+"</option>");
});
});
});
</script>
</head>
<body>
<div class="linkage_menu">
<select class="city">
<option value="">Please choose city</option>
</select>
<select class="country">
<option value="">Please choose country</option>
</select>
</div>
</body>
</html>
级联菜单
最新推荐文章于 2023-11-01 21:16:07 发布