Ajax(Asynchronous JavaScript and XML)是一种在无需刷新整个网页的情况下,能够更新部分网页的技术。它通过在后台与服务器进行少量数据交换,使网页实现异步更新。在这个基础教程的登陆小例子中,我们看到如何使用Ajax实现一个简单的用户身份验证功能。 在`login.jsp`文件中,JavaScript代码创建了一个XMLHttpRequest对象,这是Ajax的核心组件,它允许浏览器与服务器进行异步通信。`createXMLHttpRequest()`函数用于检测浏览器类型并创建相应的XMLHttpRequest实例。对于现代浏览器,它创建`XMLHttpRequest`对象;而对于较旧的IE浏览器,它创建`ActiveXObject`。 `sendRequest()`函数负责发送请求到服务器。它调用`open()`方法设置请求的类型(GET)、URL和是否异步执行(这里是true,表示异步)。然后,它设置`onreadystatechange`属性为`processResponse`函数,这个函数会在XMLHttpRequest对象的状态改变时被调用。`send(null)`发送请求,参数为null,因为这里是GET请求,所以不需要传递额外的数据。 `processResponse()`函数处理服务器返回的信息。当`readyState`等于4,表示请求已完成,且`status`等于200,说明请求成功。此时,它会获取服务器返回的XML数据中`<res>`标签的文本内容,并显示在警告框中。如果请求状态不是200,提示页面异常。 `userCheck()`函数是实际触发Ajax请求的函数。它获取用户在表单中输入的用户名和密码,如果用户名为空,则给出提示,否则调用`sendRequest()`发送包含用户名和密码的GET请求到服务器。 在服务器端,`LoginAction.java`文件中,`doGet()`方法处理来自客户端的请求。它设置了字符编码为UTF-8,确保正确处理中文字符。接着,通过`getParameter()`方法获取请求参数`uname`和`psw`。然后,设置响应内容类型为XML,并禁用缓存。通过`PrintWriter`对象,根据用户名和密码的验证结果,输出不同的响应数据。如果用户名和密码匹配,返回欢迎信息;否则,返回登录失败的信息。 这个小例子展示了Ajax的基本工作流程,包括创建XMLHttpRequest对象、发送请求、处理响应以及服务器端处理请求并返回数据。它简化了传统的网页交互,提高了用户体验,因为在验证用户身份时,页面无需完全刷新。
- 粉丝: 0
- 资源: 2
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助