首页 > 程序开发 > web前端 > HTML/CSS >

HTML编程开发之ajax

2017-03-28

HTML编程开发之ajax。

HTML编程开发之ajax

1.js (get请求服务)

var xhr = new XMLHttpRequest();//创建一个对象
//准备
xhr.open("GET", "服务器的url地址?发给服务器的数据", true);
发给服务器的数据: 键=值&键=值
true异步
//发送请求
xhr.send(true);//true,null发送请求, get
xhr.onreadystatechange = function(){
//xhr.readyState将会返回234
if (xhr.readyState == 4 )
{
if (xhr.status == 200 )//请求状态返回200
{
var a= xhr.responseText;
document.getElementById('mydiv').innerHTML = a;
}

}

}
}
2.js (post请求服务)
var xhr = new XMLHttpRequest();
xhr.open("POST", "myphp.php", true);
/将传转的数据转为form表单 中的键值对
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.send(发送给服务器的数据);
xhr.onreadystatechange=function(){
if (xhr.readyState == 4 )
{
if (xhr.status == 200 )//请求状态返回200
{
var a= xhr.responseText;
document.getElementById('mydiv').innerHTML = a;
}

}

}

}
jquery请求服务
1.$.ajax({
type:请求方式,post,get,
url:请求服务器的地址,
data:发送给服务器的数据(对象),
dataType:服务器返回的数据类型text,json,html ,
success:function(data,status,object){请求服务器成功后执行的回调函数
(返回的数据, 请求的状态,ajax对象)
},
error:function(status,object){请求服务器失败执行的回调函数
(ajax对象, 请求的状态)
}
});
相关文章
最新文章
热点推荐