效果图
vcq9us1wb3N0t73Kvcfrx/PJ9dbBu7nT0LK/t9a0+sLrysfT0LrctPPH+LHwtcSjrMTH06bI57rOzai5/bT6wuu1xLe9yr3GwbHO1eLQqcf4sfDE2KOs1eLA787Sw8e3wtK7z8JqUXVlcnkgtcQkLmFqYXgoKSC3vbeooaMKPHByZSBjbGFzcz0="brush:java;">//封装ajax function ajax(obj) { var xhr = creatXmlHttpRequest(); obj.url = obj.url + ' rand=' + Math.random(); obj.data = params(obj.data); if (obj.method === 'get') obj.url += obj.url.indexOf(' ') == -1 ' ' + obj.data : '&' + obj.data; if (obj.async === true) { xhr.onreadystatechange = function () { if (xhr.readyState == 4) { callback(); } }; } xhr.open(obj.method, obj.url, obj.async); if (obj.method === 'post') { xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); xhr.send(obj.data); } else { xhr.send(null); } if (obj.async === false) { callback(); } function callback() { if (xhr.status == 200) { obj.success(xhr.responseText); //回调传递参数 } else { alert('获取数据错误!错误代号:' + xhr.status + ',错误信息:' + xhr.statusText); } } }
//名值对转换为字符串
function params(data) {
var arr = [];
for (var i in data) {
arr.push(encodeURIComponent(i) + '=' + encodeURIComponent(data[i]));
}
return arr.join('&');
}
window.onload = function(){
document.getElementById("username").onchange = function(){
ajax({
method : 'post',
url : 'checkuserByJSON.jsp',
data : {
'username' : document.rgform.username.value,
'password' : document.rgform.password.value
},
success : function (text) {
var _ret = eva l('(' + text + ')');
document.getElementById("msg").innerHTML = _ret.tip;
},
async : true
});
}
}
我们给ajax传的就是一个object对象,是不是已经很贴近jQuery的方式了呢。