尽管各种各样简化ajax方式有很多,但是在开发中不免会遇到只能写js的时候,下面写一下自己用js直接实现与服务器交互的代码
创建Ajax对象—>w3school粘过来的(固定写法)
function createAjax(){
var xmlhttp;
if (window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
return xmlhttp;
}
重点是如何与服务器交互(POST方式)
粘贴局部—>体现交互,具体逻辑自己实现即可
//创建ajax对象
var ajax=createAjax();
//设置method和url
var method="POST";
//带一个time为了兼容IE,IE的缓存机制会抑止两次相同的get
var url="${pageContext.request.contextPath}/verificateCodeServlet?time="+new Date().getTime();
//准备ajax
ajax.open(method,url);
//设置post传递请求头,固定写法
ajax.setRequestHeader("Content-type","application/x-www-form-urlencoded");
//发送
var content="verificationCode="+value;
//如果是GET,这里为null即可
ajax.send(content);
//------------等待服务器端响应处理的函数,监听机制-----------------
ajax.onreadystatechange=function(){
//状态4,表示客户端完全收到了响应,但是不一定正常,所以还要判断200状态码
if (ajax.readyState==4 && ajax.status==200){
//具体处理服务器响应的正确数据(200状态码)
var url= ajax.responseText;
//设置tip属性
tipElement.src=url;
//修改css,显示tip
tipElement.style.display='inline';
}
}