怎么用ajax实现无刷新级联

如何用ajax实现无刷新级联
下拉框中的数据是在数据库中读取的，读取数据的方法写在当前jsp页面中。
一级下拉框值变动，下一级下拉框的至随之改变。
应该如何实现？

我写的数据能读取出来但是下一级下拉框中的值不会变化，请各位帮忙！
我的js代码：

JScript code

        <script type="text/javascript">function oneCateChange() {    var catID = document.getElementById("oneCate").value;    var docLibID_PUB = document.getElemnetById("docLib_PUB").value;    /*var url="compareProgram.jsp?catID="+catID;    location.href = url;*/    $.ajax( {        type : "POST",        url : "compareProgram.jsp",        data : "catID=" + catID + "&docLibID_PUB=" + docLibID_PUB,    });}</script>

jsp代码

HTML code

<td>                        一级栏目:                    </td>                    <td>                        <select id="oneCate" onchange="oneCateChange()">                            <option value="">                                请选择栏目                            </option>                            <%                                    for (int i = 0; i < cats.length; i++) {                                        category = cats[i];                            %>                            <option value="<%=category.getCatID()%>">                                <%=category.getCatName()%>                            </option>                            <%                                    }                            %>                        </select>                    </td>                    <%if(catList.size()>0){%>                    <td>                        二级栏目                    </td>                    <td>                        <select id="twoCate">                            <%                                    System.out.println(catList.size() + "***");                                    for (int i = 0; i < catList.size(); i++) {                                        category = catList.get(i);                            %>                            <option value="<%=category.getCatID()%>">                            <% System.out.println(category.getCatID());%>                                <%=category.getCatName()%>                            </option>                            <%                                System.out.println(category.getCatName());                                    }                            %>                        </select>                    </td>                    <%} %>

[解决办法]
$.ajax( {
type : "POST",
url : "compareProgram.jsp",
data : "catID=" + catID + "&docLibID_PUB=" + docLibID_PUB,
success : fucntion(data){
$("#twoCate").empty();
$("<option value=\"0\">==请选择==</option>").appendTo($select);
for(var i=0;i<data.length;i++){
$("<option value=\""+data[i].getCatID+"\">"+data[i].getCatName+"</option>").appendTo($("#twoCate"));
}
}
});

查看更多 下一篇