文章摘要
这篇文章的核心内容是介绍如何使用JavaScript和AJAX技术实现在线查询功能。文章通过HTML表格中的下拉菜单功能,展示了如何利用JavaScript调用AJAX接口提交表单数据,并通过成功响应更新下拉菜单的选项。文章详细描述了表单提交、AJAX数据处理以及DOM操作的具体实现过程。通过该技术,可以实现无需页面刷新即可完成查询操作,提升了用户体验。
$(“#level”).click(function(){
$.ajax({
type:”POST”,
url:”{:U(‘Target/queryMajor’)}”,
dataType: “json”,
data:{
level:$(‘#level’).val()
},
success:function(data){
$(“#major”).empty();
switch (data.status){
case ‘1’:
$(“#major”).append(“<option value=” >–</option>”);
$.each(data.data,function(index,val){
$(“#major”).append(‘<option value=’+val.major+’ >’+val.major+'</option>’);
});
break;
case ‘0’:
$(“#major”).append(“<option value=” >–</option>”);
break;
}
return false;
}
});
return false;
});
$(“#level”).click(function(){
$.ajax({
type:”POST”,
url:”{:U(‘Target/queryMajor’)}”,
dataType: “json”,
data:{
level:$(‘#level’).val()
},
success:function(data){
$(“#major”).empty();
switch (data.status){
case ‘1’:
$(“#major”).append(“<option value=” >–</option>”);
$.each(data.data,function(index,val){
$(“#major”).append(‘<option value=’+val.major+’ >’+val.major+'</option>’);
});
break;
case ‘0’:
$(“#major”).append(“<option value=” >–</option>”);
break;
}
return false;
}
});
return false;
});
© 版权声明
文章版权归作者所有,未经允许请勿转载。