求指点一个实现三级下拉框的Jquery或Ajax脚本（已有JSON数据）JSON数据示例：}]我想要实现一个三级联动下拉框
求指点一个实现三级下拉框的Jquery或Ajax脚本（已有JSON数据）
JSON数据示例：
}
]
我想要实现一个三级联动下拉框，type-->report-->company
从来没有写过Jquery或Ajax，求大神指点一下
ps.JSON数据是Struts2 Action返回
[解决办法]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<script type="text/javascript">
var str=[{"reports":[{"companies":[{"companyName":"company1"},{"companyName":"company2"}],"rptName":"rpt1"},{"companies":[{"companyName":"company1"},{"companyName":"company2"}],"rptName":"rpt2"}],"typeName":"type1"},
{"reports":[{"companies":[{"companyName":"company1"},{"companyName":"company2"}],"rptName":"rpt1"},{"companies":[{"companyName":"company1"},{"companyName":"company2"}],"rptName":"rpt2"}],"typeName":"type2"}];
$(function(){
$(str).each(function(key,val){
$("<option value="+val.typeName+">" + val.typeName + "</option>").appendTo($("#selF"));
});
//以上是加载第一个文本框
$("#selF").change(function(){//第一个文本框的改变事件
var s=this.value;//第一个文本框的当前值
$(str).each(function(key,val){//找到第一个文本框的下级成员
if(val.typeName==s){
$("#selT").html("<option>请选择</option>");
$(val.reports).each(function(k,v){//添加第二个文本框成员
$("<option value="+v.rptName+">" + v.rptName + "</option>").appendTo($("#selT"));
});
$("#selT").change(function(){//第二个文本框的改变事件
var s1=this.value;
$(val.reports).each(function(ke,va){//找到第二个文本框当前值得下级成员
if(va.rptName==s1){
$("#selC").html("<option>请选择</option>"); //第三个文本框成员
$(va.companies).each(function(kq,vq){
$("<option value="+vq.companyName+">" + vq.companyName + "</option>").appendTo($("#selC"));
});
}
});
});
}
});
});
})
</script>
</head>
<body>
typeName：<select id="selF"><option>请选择</option></select>
rptName：<select id="selT"><option>请选择</option></select>
companyName：<select id="selC"><option>请选择</option></select>
</body>
</html>
