在实际开发中,存在多个下拉菜单,下一个下拉菜单选项是由上一个上拉菜单的选项决定,意即上一个下拉菜单不同的选项将会导致下一个或多个下拉菜单选项跟着改变。此时,下拉菜单的选项就不能写死了,有时需要从数据库服务器读出数据动态加载上去,此时可使用jquery动态赋值。直接上代码:
function setCataList(code){
$.ajax({
type : "GET",
dataType : "json",
url : "/krksz/machine/getDeviceNo?code=" + code,
async : false,
timeout : 30000,
success : function(data){
var sel = document.getElementById("deviceSnExt");
sel.options.length = 0;
sel.add(new Option("请选择", ""));
if(data[0]==null){
sel.disabled = true;
}else{
for(var i = 0;i < data.length; i++)
{
sel.disabled = false;
方法一: sel.add(new Option(data[i].deviceNo));
方法二: /* var opt = new Option();
opt.value= data[i].id;
opt.text = data[i].deviceNo;
sel.append(opt); */
}
}
},
error : function(){
}
});
}
个人 试过两种方法,第二种方法在谷歌和火狐浏览器上测试时点击下拉选框,可以把选项添加上去,但用IE11测试时却没有加载进下拉选框。不知是自己哪里没写好,还是本身这种方法有局限性,用第一种方法在三个浏览器上测试都没有问题,果断用第一种。同时也欢迎各路大神指教。