当选择第一个下拉框的option时,通过ajax向后台指定servlet发送请求,得到的数据以json文件的形式传回来,成功的话,则执行success,否则执行error。获取想要在第二个下拉框显示的数据时,动态添加option
第一个下拉框
<select class="form-control" id="academy" name=""></select>
第二个下拉框
<select class="form-control" id="major" name="major"></select>
ajax代码
$("#academy").click(function() {
$.ajax({
data : {
academy : $("#academy").val()
},
type : "POST",
url : " ",
cache : false,
dataType : "json",
async : false,
success : function(data) {
// 清除之前select下拉框下的option
document.getElementById("major").options.length = 0;
for (var i = 0; i < data.length; i++) {
var option = document.createElement("option");
$(option).val(data[i].m_name);
$(option).text(data[i].m_name);
$('#major').append(option);
}
},
error : function(xhr, state, error) {
alert("error" + state);
}
})
return false;
})
其中success是获取数据之后执行的代码,首先清除之前select下拉框下的option,再遍历数据在第二个下拉框显示,如有问题请多指教。