最近很多人问我ajax该怎么用,怎么访问后台,怎么取得数据页面显示
写一个简单的ajax访问:
- $.ajax({
- url: ctx +"/meeting/getMeetingRoomMap", //请求后台地址
- type:"get", //请求方式
- cache:false, //控制是否缓存数据(post请求默认false,而get请求会为true,容易造成页面数据缓存问题)
- async:false, //控制同步还是异步
- data:{scheduleDate:scheduleDate}, //传入参数
- success:function(data){
- if(data!=null && data!=""){
- $(".showMessage").html(data); //从后台获取数据的回调函数
- }
- }
- });
使用ajax需要注意的两点:
1、cache属性,默认为true, 就是页面是否需要缓存的问题,很多人说明明修改了值,为什么值没变,就是因为这个属性在作怪,请求的时候,可以设置为false
2、async属性,默认为true, 这个属性是决定你本次ajax请求是同步还是异步。 如果没设置这个属性为false,同步的话:js也会像后台代码一样,一行一行执行下去,
默认为true,异步那就有可能出现你的ajax还没执行完,就去执行你的下一句js了
其实ajax挺简单的,请求后台,获取数据回调, 然后页面展示,需要注意的就上面两点,祝你们使用愉快
————————————————————————————————
test.html
<a href="javascript:void(0)" onmouseover="testAsync()">
asy.js
function testAsync(){
var temp;
$.ajax({
async: false,
type : "GET",
url : ‘tet.php‘,
complete: function(msg){
alert(‘complete‘);
},
success : function(data) {
alert(‘success‘);
temp=data;
}
});
alert(temp+‘ end‘);
}
tet.php
<?php
echo "here is html code";
sleep(5);
?>
async: false,(默认是true);
如上:false为同步,这个 testAsync()方法中的Ajax请求将整个浏览器锁死,
只有tet.php执行结束后,才可以执行其它操作。
当async: true 时,ajax请求是异步的。但是其中有个问题:testAsync()中的ajax请求和其后面的操作是异步执行的,那么当tet.php还未执行完,就可能已经执行了 ajax请求后面的操作,
如: alert(temp+‘ end‘);
然而,temp这个数据是在ajax请求success后才赋值的,结果,输出时会为空。