select三级联动jquery

varbrand_a=[["安驰;anchi","奥迪;aodi"],];varbrand_b=[["安驰","小公主;xgz","人生;rs"],["奥迪","小王子;... var brand_a=[
["安驰;anchi","奥迪;aodi"],
];
var brand_b = [
["安驰","小公主;xgz","人生;rs"],
["奥迪","小王子;xwz","前途;qt"],
];

var brand_c = [
["小公主","1999 自动;xgz1999","2001 手动;xgz2001"],["人生","1999 自动;rs1999","2001 手动;rs2001"],
["小王子","1999 自动;xwz1999","2001 手动;xwz2001"],["前途","1999 自动;qt1999","2001 手动;qt2001"],
];

<select id="brand_a"></select>
<select id="brand_b"></select>
<select id="brand_c"></select>
如何实现安驰,小公主,1999 自动
展开
 我来答
yugi111
推荐于2016-06-19 · TA获得超过8.1万个赞
知道大有可为答主
回答量:5.1万
采纳率:70%
帮助的人:1.3亿
展开全部
<!DOCTYPE html>
<html>
  <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script class="jquery library" src="/js/sandbox/jquery/jquery-1.8.2.min.js" type="text/javascript"></script>
<title>
RunJS 演示代码
</title>
<script>
var brand_a = ["安驰", "奥迪"];
var brand_b = {
"安驰": ["小公主", "人生"],
"奥迪": ["小王子", "前途"]
};
var brand_c = {
"小公主": ["1999 自动", "2001 手动"],
"人生": ["1999 自动", "2001 手动"],
"小王子": ["1999 自动", "2001 手动"],
"前途": ["1999 自动", "2001 手动"]
};
jQuery(function($){
var a = $("#brand_a"),
b = $("#brand_b"),
c = $("#brand_c");
a.append("<option value=''>请选择</option>");
b.append("<option value=''>请选择</option>");
c.append("<option value=''>请选择</option>");
$(brand_a).each(function(i, dom){
a.append("<option value='"+dom+"'>" + dom + "</option>");
});
a.change(function(){
var me = $(this),str;
if(str = me.val()){
var arr = brand_b[str];
b.html("").append("<option value=''>请选择</option>");
c.html("").append("<option value=''>请选择</option>");
$(arr).each(function(i, dom){
b.append("<option value='"+dom+"'>" + dom + "</option>");
});
}else{
b.html("").append("<option value=''>请选择</option>");
c.html("").append("<option value=''>请选择</option>");
}
});
b.change(function(){
var me = $(this),str;
if(str = me.val()){
var arr = brand_c[str];
c.html("").append("<option value=''>请选择</option>");
$(arr).each(function(i, dom){
c.append("<option value='"+dom+"'>" + dom + "</option>");
});
}else{
c.html("").append("<option value=''>请选择</option>");
}
});
});
</script>
  </head>
<body>
<select id="brand_a"></select>  
<select id="brand_b"></select>  
  <select id="brand_c"></select>
  </body>
</html>
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式