例子:
function loadXMLDoc(email_){ var xmlhttp; if(window.XMLHttpRequest){//判断浏览器是否支持XMLHttpRequest()对象。 xmlhttp=new XMLHttpRequest();// }else{//不支持的话创建ActiveXObject()对象。 xmlhttp= new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function()//状态改变时调用 { if(xmlhttp.readyState==4&&xmlhttp.status==200){ document.getElementById("myDiv").innerHTML=xmlhttp.responseText; } else{document.getElementById("myDiv").innerHTML="用户名拉取失败";} } var url="do/user?email="+email_; xmlhttp.open("GET",url,true) xmlhttp.send(); } function getValue(){//用来获取ID的值。 var str=document.getElementById("email").value; loadXMLDoc(str); }
一下为servlet的代码:
package cn.wodeschool.school.web.controller; import java.io.IOException; import java.util.List; import javax.servlet.servletexception; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import cn.wodeschool.school.model.entity.User; import cn.wodeschool.school.model.servicer.imple.ServiceFactory; @WebServlet("/do/user") public class LoginUserServlet extends HttpServlet{ private static final long serialVersionUID = -2726821096314314651L; protected void doPost(HttpServletRequest request,HttpServletResponse response) throws servletexception,IOException{ String op =request.getParameter("op"); String email=request.getParameter("email"); String password=request.getParameter("password"); User user=new User(); user.setEmail(email); user.setPassword(password); if("reg".equals(op)){ doRegister(request,response,user); }else if("login".equals(op)){ doLogin(request,user); } } @SuppressWarnings("unchecked") private void doLogin(HttpServletRequest request,HttpServletResponse response,User user) throws IOException { List<User> list=ServiceFactory.getService("user").findByConditions(user.getEmail()); if(list.isEmpty()||!list.get(0).getpassword().equals(user.getpassword())){ response.getWriter().write("用户名或者密码错误"); return; } request.getSession().setAttribute("user",list.get(0)); response.getWriter().write("登录成功"); } private void doRegister(HttpServletRequest request,User user) throws IOException { String phone=request.getParameter("phone"); String name=request.getParameter("name"); String profession=request.getParameter("profession"); user.setName(name); user.setPhone(phone); user.setProfession(profession); @SuppressWarnings("unchecked") List<User> list=ServiceFactory.getService("user").findByConditions(name); if(!list.isEmpty()){ response.getWriter().write("该邮箱已经被注册"); return; } int row=ServiceFactory.getService("user").save(user); //request.getSession().setAttribute("users",user); System.out.println(row); } protected void doGet(HttpServletRequest request,HttpServletResponse response) throws servletexception,IOException{ String email=request.getParameter("email"); System.out.println(email); @SuppressWarnings("unchecked") List<User> list=ServiceFactory.getService("user").findByConditions(email); if(list.isEmpty()){ response.getWriter().write("邮箱可用"); return ; }else{ response.getWriter().write("该邮箱已经被注册"); } } }
XMLHttpRequest是ajax的基础,创建XMLhttprequest的方法是:老版本的 Internet Explorer (IE5 和 IE6)使用 ActiveX 对象:
variable=new XMLHttpRequest(); variable=new ActiveXObject("Microsoft.XMLHTTP");
在使用时首先判断浏览器是否支持XMLHttpRequest对象if(window.XMLHttpRequest)。
如果需要向服务器发送请求,使用XMLHttpRequest对象的open()和send()方法。
xmlhttp.open("method","url"async); xmlhttp.send();
method表示请求的方式,post或者get,url请求的地址。async:true(异步)或false(同步).
send(string)将请求发送到服务器,string仅用于POST请求。
简单的POST请求。
xmlhttp.open("POST","demo_a",true);
xmlhttp.send();
如果要想HTML表单那样post数据,使用setRequestHeader()来添加HTTP头。
xmlhttp.open("POST","ajax_test.html",true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("fname=Henry&lname=Ford");
setRequestHeader(header,value) header.规定头的名称,value:规定头的值。
xmlhttp.responseText;//获得字符串形式的响应数据;
onreadystatechange 事件
当请求被发送到服务器时,我们需要执行一些基于响应的任务。
每当 readyState 改变时,就会触发 onreadystatechange 事件。
readyState 属性存有 XMLHttpRequest 的状态信息。
下面是 XMLHttpRequest 对象的三个重要的属性:
属性 | 描述 |
---|---|
onreadystatechange | 存储函数(或函数名),每当 readyState 属性改变时,就会调用该函数。 |
readyState | 存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。
|
status | 200: "OK" 404: 未找到页面 |
菜鸟教程的例子:http://www.runoob.com/ajax/ajax-xmlhttprequest-onreadystatechange.html
原文地址:https://www.jb51.cc/ajax/161889.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。