`

一个简单的Ajax登录例子

    博客分类:
  • ajax
阅读更多

1.view(loginAjax.jsp)

Code:
  1. <%@pagecontentType="text/html;charset=UTF-8"language="java"%>
  2. <head>
  3. <METAhttp-equiv=Content-Typecontent="text/html;charset=UTF-8">
  4. </head>
  5. <scriptlanguage="javascript">
  6. varXMLHttpReq=false;
  7. //创建XMLHttpRequest对象
  8. functioncreateXMLHttpRequest(){
  9. if(window.XMLHttpRequest){//Mozilla浏览器
  10. XMLHttpReq=newXMLHttpRequest();
  11. }elseif(window.ActiveXObject){//IE浏览器
  12. try{
  13. XMLHttpReq=newActiveXObject("Msxml2.XMLHTTP");
  14. }catch(e){
  15. try{
  16. XMLHttpReq=newActiveXObject("Microsoft.XMLHTTP");
  17. }catch(e){
  18. }
  19. }
  20. }
  21. }
  22. //发送请求函数
  23. functionsendRequest(url){
  24. createXMLHttpRequest();
  25. XMLHttpReq.open("GET",url,true);
  26. XMLHttpReq.onreadystatechange=processResponse;//指定响应函数
  27. XMLHttpReq.send(null);//发送请求
  28. }
  29. //处理返回信息函数
  30. functionprocessResponse(){
  31. if(XMLHttpReq.readyState==4){//判断对象状态
  32. //window.alert(XMLHttpReq.status);测试
  33. if(XMLHttpReq.status==200){//信息已经成功返回,开始处理信息
  34. varres=XMLHttpReq.responseXML.getElementsByTagName("res")[0].firstChild.data;
  35. window.alert(res);
  36. }else{//页面不正常
  37. window.alert("您所请求的页面有异常。");
  38. }
  39. }
  40. }
  41. //身份验证函数
  42. functionuserCheck(){
  43. varuname=document.myform.uname.value;
  44. varpsw=document.myform.psw.value;
  45. if(uname==""){
  46. window.alert("用户名不能为空。");
  47. document.myform.uname.focus();
  48. returnfalse;
  49. }else{
  50. sendRequest('loginAjax?uname='+uname+'&psw='+psw);
  51. }
  52. }
  53. </script>
  54. <bodyvLink="#006666"link="#003366"bgColor="#E0F0F8">
  55. <imgheight="33"src="<%=request.getContextPath()%>/images/enter.gif"
  56. width="148">
  57. <formaction=""method="post"name="myform">
  58. 用户名:<inputsize="15"name="uname">
  59. <p>密码:<inputtype="password"size="15"name="psw">
  60. <p><inputtype="button"value="登录Ajax"onclick=userCheck();>
  61. </form>

2.p21.loginAction.java

Code:
  1. packagep21;
  2. importjava.io.IOException;
  3. importjava.io.PrintWriter;
  4. importjavax.servlet.ServletConfig;
  5. importjavax.servlet.ServletException;
  6. importjavax.servlet.http.HttpServlet;
  7. importjavax.servlet.http.HttpServletRequest;
  8. importjavax.servlet.http.HttpServletResponse;
  9. publicclassLoginActionextendsHttpServlet{
  10. privatestaticfinallongserialVersionUID=1L;
  11. publicvoidinit(ServletConfigconfig)throwsServletException{
  12. }
  13. /*
  14. *处理<GET>请求方法.
  15. */
  16. protectedvoiddoGet(HttpServletRequestrequest,HttpServletResponseresponse)
  17. throwsServletException,IOException{
  18. //设置接收信息的字符集
  19. request.setCharacterEncoding("UTF-8");
  20. //接收浏览器端提交的信息
  21. Stringuname=request.getParameter("uname");
  22. Stringpsw=request.getParameter("psw");
  23. //设置输出信息的格式及字符集
  24. response.setContentType("text/xml;charset=UTF-8");
  25. response.setHeader("Cache-Control","no-cache");
  26. //创建输出流对象
  27. PrintWriterout=response.getWriter();
  28. //依据验证结果输出不同的数据信息
  29. out.println("<response>");
  30. System.out.println("来到servlet");
  31. if(uname.equals("nothing")&&psw.equals("123")){
  32. out.println("<res>"+"热烈的欢迎您!"+"</res>");
  33. }else{
  34. out.println("<res>"+"对不起,登录失败!"+"</res>");
  35. }
  36. out.println("</response>");
  37. out.close();
  38. }
  39. /*
  40. *处理<POST>请求方法.
  41. */
  42. protectedvoiddoPost(HttpServletRequestrequest,HttpServletResponseresponse)
  43. throwsServletException,IOException{
  44. doGet(request,response);
  45. }
  46. }

3.web.xml配置

Code:
  1. <servlet>
  2. <servlet-name>loginAjax</servlet-name>
  3. <servlet-class>p21.LoginAction</servlet-class>
  4. </servlet>
  5. <servlet-mapping>
  6. <servlet-name>loginAjax</servlet-name>
  7. <url-pattern>/loginAjax</url-pattern>
  8. </servlet-mapping>
分享到:
评论

相关推荐

    简单ajax登陆例子,新手适用

    这个“简单ajax登录例子”是一个非常适合初学者理解Ajax基本原理和使用方法的教程。在这里,我们将深入探讨Ajax如何与Servlet结合,实现用户无刷新登录验证。 1. **Ajax简介** Ajax的核心是JavaScript异步通信,它...

    ajax简单登录

    **Ajax 简单登录详解** Ajax(Asynchronous ...总的来说,"ajax简单登录"是一个实用的功能,通过Ajax技术实现了无刷新的登录体验。在实际开发中,还需要考虑安全性、用户体验和其他功能的集成,以提供更完善的服务。

    使用Ajax写的一个用户登录的例子JSP版.rar

    这个“使用Ajax写的一个用户登录的例子JSP版.rar”压缩包提供了一个基于JSP(JavaServer Pages)实现的Ajax用户登录示例。以下是关于这个示例的详细解释和相关知识点: 1. **Ajax基础**:Ajax的核心是JavaScript库...

    ajax实现简单登录

    本示例是关于如何使用AJAX实现一个简单的登录系统,无需数据库操作,非常适合初学者进行实践学习。 首先,我们需要理解AJAX的基本工作原理。AJAX的核心是XMLHttpRequest对象,它允许JavaScript在后台与服务器通信。...

    net平台开发的一个简单的Ajax登录界面

    总之,这个"NET平台开发的一个简单的Ajax登录界面"资源结合了C#编程、ASP.NET Web Forms开发、SQL数据库操作和Ajax技术,是一个很好的学习实践案例,有助于提升开发者在Web应用开发中的技能和经验。通过深入研究和...

    Ajax DRW的简单例子 源码

    在这个"Ajax DRW的简单例子 源码"中,我们可以学习如何在MyEclipse环境下搭建一个基于DWR的Ajax应用。 首先,我们需要了解DWR的基本配置。在项目中,通常会有以下几个关键文件: 1. `web.xml`:这是Web应用的部署...

    ajax实现简单登录验证

    在本文中,我们将深入探讨如何使用Ajax技术实现一个简单的登录验证功能。Ajax,即Asynchronous JavaScript and XML(异步JavaScript和XML),允许我们在不刷新整个网页的情况下与服务器进行交互,从而提供更流畅的...

    关于Ajax的简单例子

    这个压缩包文件“ajaxweb”可能包含了一个完整的Ajax登录示例的源代码,包括HTML、JavaScript和服务器端脚本。通过研究这些文件,你可以更深入地理解Ajax在实际项目中的实现细节。同时,学习如何结合前端和后端技术...

    ajax+php技术的登陆实例

    在本实例中,我们将探讨如何结合Ajax与PHP来创建一个简单的登录系统。 ### 一、前端:Ajax实现异步提交 1. **创建HTML表单**:首先,我们需要创建一个HTML登录表单,包括用户名和密码输入框以及登录按钮。例如: ...

    简单的ajax登录小程序 mysql数据库

    在这个简单的Ajax登录小程序中,我们利用Ajax技术实现了一个用户验证系统,该系统与MySQL数据库进行交互,检查用户输入的用户名是否存在于数据库中。 **1. Ajax基础** Ajax的核心是JavaScript对象XMLHttpRequest,...

    java+mysql做的简单注册登录例子

    综上所述,这个简单的注册登录例子涉及了Java后端开发、数据库设计、Web交互等多个方面,是初学者学习Web开发和实践基础技能的一个良好起点。通过这个项目,开发者可以深入了解Java与MySQL的集成,以及如何构建一个...

    ajax java 例子 学习

    例如,假设我们有一个简单的用户登录场景。在客户端,我们使用Ajax发送一个包含用户名和密码的数据包到服务器: ```javascript var xhr = new XMLHttpRequest(); xhr.open('POST', '/login', true); xhr....

    ajax简单的登录

    下面是一个简单的Ajax登录流程示例: 1. 用户在HTML表单中输入用户名和密码,点击登录按钮。 2. JavaScript监听到登录按钮点击事件,阻止其默认行为(页面跳转)。 3. 创建XMLHttpRequest实例,设置HTTP请求类型为...

    ajax做的网上购物车例子

    本示例展示了一个使用Ajax技术来实现的无刷新网上购物车,使得用户在添加、删除商品时无需重新加载整个页面,提高了用户体验。 【描述】:“jsp+ajax的实现小示例,无刷新的购物车例子。” 这个项目采用JavaServer...

    ajax增删改查的例子

    这个"ajax增删改查的例子"是一个很好的实践教程,可以帮助开发者深入理解如何在实际项目中运用AJAX进行数据操作。 首先,让我们来看看"用户名验证"这一部分。在用户注册或登录时,实时验证用户名的可用性是常见的...

    这是一个简单登陆验证也可以改为检查用户名是否存在的ajax例子(可以自由扩张)

    题目中提到的例子是一个简单的登录验证或检查用户名是否存在的功能。这通常涉及到以下步骤: 1. **用户输入**:用户在表单中输入用户名。 2. **发送Ajax请求**:当用户按下检查按钮时,使用JavaScript捕捉到此事件...

    ext入门程序登陆例子

    【标题】:“EXT入门程序登录例子” EXT是一个强大的JavaScript库,用于构建富客户端Web应用程序。这个入门程序是一个基于EXTJS的登录示例,它在不依赖数据库的情况下展示了用户登录的基本功能。EXTJS以其丰富的...

    ajax小例子

    在这个"ajax小例子"中,我们可以深入理解Ajax的基本原理及其在用户登录场景中的应用。 首先,Ajax的核心是XMLHttpRequest对象,它是JavaScript内置的对象,负责与服务器进行通信。当用户在登录表单中输入用户名和...

Global site tag (gtag.js) - Google Analytics