二级联动菜单动态刷新下拉列表的一种实现方法

若实现这个功能可以从以下思路出发：

1. 定义两个select框，每个框都通过从数据库读取数据来改变下拉选项的文字。
2. 给第一个select框定义一个onchange事件，当选定内容有变化时触发该函数。
3. 该函数根据获取第一个下拉框的值刷新第二个select框的下拉选项的值。

简单的实现如下：

定义两个下拉框，其中第一个下拉框定义了一个onchange事件，该事件触发ChangeTextNo()函数；

<select id="selectTest" onchange="ChangeTextNo()">
    <option value="0">--请选择考试名称--</option>
</select>
<select id="selectNo">
    <option value="0">--请选择考试次数--</option>
</select>

ChangeTextNo函数如下：

function ChangeTextNo(){
        var index = $('#selectTest option:selected').text();
        var optionJson=[];
        $.ajax({
            type: "post",
            url: "/getTestNo",
            data: {"name":index},
            async: false,
            success: function(data){
                optionJson = data;
                var selectObj=document.getElementById("selectNo");
                selectObj.options.length=0;
                selectObj.options.add(new Option("请选择考试次数",0));

                for(var i=0;i<optionJson.length;i++){
                    selectObj.add(new Option(optionJson[i],i+1));
                }
            }

        });

    }

最终该代码实现如下效果：

 获取select选择框填充内容的方法请参考：http://www.cnblogs.com/liesun/p/7416969.html