问题描述
文件不报错 但是没有效果 <!doctype html><html lang="en"> <head> <meta charset="UTF-8"> <script type="text/javascript" src="d:/easyui/jquery.min.js"></script> <title>下拉列表框联动</title> <style type="text/css"> body{font-size:13px} ,clsInit{width:435px,height:35px;line-height:35px;padding-left:10px} .clsTip{padding-top:5px;background-color:#eee;display:none} .btn{border:#666 1px solid;padding:2px;width:65px;float:right;margin-top:6px;margin-right:6px;filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ffffff,EndColorStr=#ECE9D8);} </style> <script type="text/javascript"> $(function(){ function objInit(obj){ //下拉列表初始化 return $(obj).html("<option>请选择</option>"); } var arrData = { //定义一个数组保存相关数据 厂商1:{品牌1_1:"型号1_1_1,型号1_1_2",品牌1_2:"型号1_2_1,型号1_2_2"}, 厂商2:{品牌2_1:"型号2_1_1,型号2_1_2",品牌2_2:"型号2_2_1,型号2_2_2"}, 厂商3:{品牌3_1:"型号3_1_1,型号3_1_2",品牌1_2:"型号3_2_1,型号3_2_2"} }; //这个函数的参数pF是什么 前面没有定义 是怎么得到的 $.each(arrData,function(pF){ //遍历数据增加厂商选项 $("#self").append("<option>"+pF+"</option>"); }); $("#selF").change(function(){ //厂商列表框选项改变事件 objInit("#selT"); objInit("#selC"); $.each(arrData,function(pF,pS){ //如果厂商选中项与数据匹配 if($("#selF option:selected").text() == pF){ //遍历数据增加品牌项 $.each(pS,function(pT,pC){ $("#selT").append("<option>"+pT+"</option>"); }); //品牌列表框选项改变事件 $("#selT").change(function(){ objInit("#selC"); $.each(pS,function(pT,pC){ //如果品牌选中项与数据匹配 if($("#selT option:selected").text() == pT){ //遍历数据增加型号项 $.each(pC.split(","),function(){ $("#selC").append("<option>"+this+"</option>"); }); } }); }); } }); }); $("#Button1").click(function(){ var strValue = "您选择的厂商："; strValue += $("#selF option:selected").text(); strValue += " 您选择的品牌："; strValue += $("#selT option:selected").text(); strValue += " 您选择的型号："; strValue += $("#selC option:selected").text(); $("#divTip").show().addClass("clsTip").html(strValue); }); }) </script> </head> <body> <div class="clsInit">厂商：<select id="selF"><option>请选择</option></select>品牌：<select id="selT"><option>请选择</option></select>型号：<select id="selC"><option>请选择</option></select><input id="Button1" type="button" value="查询" class="btn" /> </div><div id="divTip" class="clsInit"></div> </body></html>
解决方案
注意代码中的大小写//遍历数据增加厂商选项 $("#selF").append("<option>"+pF+"</option>");
解决方案二：
huasuoworld的解决方案，测试有效