声明:本文章系Jarvis原创,转载请注明!

这是html代码,大家看个意思就可以.

 1<select onchange="typeChange(this)">
 2                            <option value="">
 3                                请选择类型
 4                            </option>
 5                            <s:iterator value="sightTypes">
 6                                <option value="${id }">
 7                                    ${typeName }
 8                                </option>
 9                            </s:iterator>
10                        </select>
主要思路:
1.列出一级列表
2.AJAX查找一级列表是否有下级 有增加一个select
 1function typeChange(obj){
 2                var o = $(obj);
 3                var value = o.val();
 4                var o_stId = $('#sightTypeId');
 5                o_stId.val(value);
 6                o.nextAll().remove();
 7                if(value != null && value != ""){
 8                    //有选择 获取下一级
 9                    $.ajax({
10                        type:'POST',
11                        url:'地址',
12                        data:'npid=' + value,
13                        dataType:'json',
14                        success:function(msg){
15                            if(msg != null && msg.length >0){
16                                //有下级数据
17                                var addHtml = "<select onchange=\"typeChange(this)\"><option value=\"\">请选择类型</option>";
18                                for(var i = 0;i < msg.length;i++){
19                                    addHtml += "<option value=\"" + msg[i].id + "\">" + msg[i].typeName + "</option>";
20                                }
21                                addHtml += "</select>";
22                                o.after(addHtml);
23                            }else{return;}
24                        }
25                    });
26                }
27            }