例子为主

html主要代码

<div class="fl search">厂商:<select id="firms"><option>请选择</option></select> 品牌:<select id="brandmark"><option>请选择</option></select> 型号:<select id="type"><option>请选择</option></select>

js:

$(function(){

function init(obj){
return $(obj).html("<option>请选择</option>");
}
var goodsData = {
小米: {小米:"小米3,小米4",红米:"红米note,红米note2"},
苹果: {iphone:"iphone5,iphone6",ipad:"ipad1,ipad2"},
魅族: {魅族:"魅族1,魅族2",魅蓝:"魅蓝1,魅蓝note"}
};
var f = false;
var b = false;
var t = false;
$.each(goodsData,function(fs){
$('#firms').append("<option>"+fs+"</option>");

});
$('#firms').change(function(){
f = true;
init("#brandmark");
init("#type");
$.each(goodsData,function(fs,bo){

if($('#firms option:selected').text() == fs){
$.each(bo,function(bd,tp){
$('#brandmark').append("<option>"+bd+"</option>");
});
$('#brandmark').change(function(){
init("#type");
b = true;
$.each(bo,function(bd,tp){
if($('#brandmark option:selected').text() == bd){
$.each(tp.split(","),function(){
$('#type').append("<option>"+this+"</option>")
});
}
});
$('#type').change(function(){
t = true;
});
});
}
});
});
$('#searchBtn').click(function(){
if(f&&b&&t){
var str = "你选择的厂商:";
str += $('#firms option:selected').text();
str +="&nbsp;你选择的品牌:";
str += $('#brandmarkm option:selected').text();
str +="&nbsp;你选择的型号:";
str += $('#type option:selected').text();
$('.showdata').show().html(str);
}else if(f&&!b&&!t){
$('.showdata').show().html("请选择品牌和型号");
}else if(f&&b&&!t){
$('.showdata').show().html("请选择型号");
}else{
$('.showdata').show().html("请选择商品");
}
});
});

随机推荐

  1. Installshield建立IE快捷方式的方法

    原文:Installshield建立IE快捷方式的方法 实现方法:在project assistant里或者install design里随便建一个快捷方式,然后去install design里修改刚 ...

  2. 如何查看IC卡燃气表读数和剩余量?

    如今新建的楼房都是使用IC卡燃气表,拿到房子入住时也没有见到IC卡燃气表的使用说明书.非常多人可能为此而苦恼.这里就讲一下怎样查看IC卡燃气表读数及剩余金额. 产品外观 可选功能 watermark/ ...

  3. SSM 使用方法

    System Safety Monitor(以下简称为SSM),它是一款俄罗斯出品的系统监控软件,通过监视系统特定的文件(如注册表等)及应用程序,达到保护系统安全的目的.在某些功能上比Winpatro ...

  4. 如果在VMware上免费下载驱动

    1.在不登录,或者没有账号的情况下,进入VMare的驱动下载界面,可以发现有一个大大的Download按钮. 2.点这个按钮,会提示登录. 3.注册账号登录后,回到驱动下载界面,会发现Download ...

  5. Serv-U执行CMD命令

    site exec + 命令.比如关机: site exec shutdown -r -t 0 注意,网上很多教程在前面加了一个“quote”,实测根本无效,不知道那些教材是怎么回事. 执行方式有很多 ...

  6. java 学习List 的 add 与set差分法

    /** * 在List收集在许多方面.add(int index,Object obj)方法与set(int index,Object e)方法不易区分 * .通过以下实例.能够看出两个方法中的差别 ...

  7. 依据道路的shape获得high_cross和low_cross

    如图所看到的:怎样依据提供的道路的shape file获得该路的high cross和low cross 所谓的high cross就是图中的king st这条路,low cross是Gravers ...

  8. hdu 1059 Dividing 多重背包

    点击打开链接链接 Dividing Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others ...

  9. SSMS2008插件开发(1)--介绍

    原文:SSMS2008插件开发(1)--介绍 SSMS2008就是Microsoft Sql Server Management Studio 2008的简称.许多人叫做SQL2008或SQL SER ...

  10. robin 今日南

    我很高兴,在学校体育馆看到李彦宏博士. 这是第一个真正的一次在媒体上看到,只能看到人才足够多的人,现实,我觉得非常好. 我不是一个真正罗宾的粉丝.百度是不是很热衷于这家公司.,但现在我仍然兴奋,我会被 ...