rainyzz's blog

ajax同步请求与异步请求

开发中需要编写一个更加复杂的两级下拉菜单的时候,需要到数据库中读取数据,显示到二级下拉列表中去,就需要使用用ajax发送请求到后台读取数据,将用户选择的选项数据num传到后台去,在java类中读取列表信息,拼接成html标签,然后调用标签对象的html()方法把标签实时添加进页面,实现用户选择第一级菜单,第二级菜单自动填充的效果,代码如下:

1
2
3
4
5
6
7
8
9
10
11
var option = {
url: 'nsti!addOptions.action',
type: 'POST',
data: {topselect: num},
dateType:'json',
async: false,
success:function(data){
$("#authid").html(data);
}
};
$.ajax(option);

在开发中,用户提交请求后,如果用户需要修改,就必须先读出用户的选择,显示在页面上,但是在使用jquery对动态生成的select对象进行选择时,却提示为空。之前以为jquery是操作不了动态生成的对象的,因为直接看源码里面没有动态对象。后来才了解到ajax默认是异步执行,也就是发了ajax请求以后,不等请求的数据返回来就直接执行,对select对象的操作又是紧接着ajax操作的,所以导致动态的二级下拉列表还没有生成就去选择,就无法选中。后来通过添加async: false参数,改成同步执行,也就是接下来的代码需要等待ajax操作结束后才能执行,就可以正常选中select对象进行操作。