`

Ajax+servlet无刷新验证用户名

    博客分类:
  • java
阅读更多
    页面端(login.jsp):
<span><span><div class='code_title'><div class='dp-highlighter'><div class='bar'/><ol class='dp-c'>    <li class='alt'><span><span><%@ page language=</span><span class='string'>"java"</span><span> </span><span class='keyword'>import</span><span>=</span><span class='string'>"java.util.*"</span><span> pageencoding=</span><span class='string'>"gb2312"</span><span>%>   </span></span></li>    <li class=''><span><!doctype html public </span><span class='string'>"-//w3c//dtd html 4.01 transitional//en"</span><span>>   </span></li>    <li class='alt'><span><html>   </span></li>    <li class=''><span> <head>   </span></li>    <li class='alt'><span> <title>ajax验证用户名是否存在例子</title>   </span></li>    <li class=''><span> <script>   </span></li>    <li class='alt'><span>    </span></li>    <li class=''><span> </span><span class='comment'>//设一个变量 </span><span>  </span></li>    <li class='alt'><span>    </span></li>    <li class=''><span> </span><span class='keyword'>var</span><span> xmlhttpreq=</span><span class='keyword'>false</span><span>;   </span></li>    <li class='alt'><span>  </span><span class='comment'>//创建一个xmlhttprequest对象 </span><span>  </span></li>    <li class=''><span>  </span><span class='keyword'>function</span><span> createxmlhttprequest(){   </span></li>    <li class='alt'><span>    </span><span class='keyword'>if</span><span>(window.xmlhttprequest){ </span><span class='comment'>//mozilla  </span><span>  </span></li>    <li class=''><span>     xmlhttpreq=</span><span class='keyword'>new</span><span> xmlhttprequest();   </span></li>    <li class='alt'><span>     }   </span></li>    <li class=''><span>     </span><span class='keyword'>else</span><span> </span><span class='keyword'>if</span><span>(window.activexobject){   </span></li>    <li class='alt'><span>      </span><span class='keyword'>try</span><span>{   </span></li>    <li class=''><span>       xmlhttpreq=</span><span class='keyword'>new</span><span> activexobject(</span><span class='string'>"msxml2.xmlhttp"</span><span>);   </span></li>    <li class='alt'><span>       }</span><span class='keyword'>catch</span><span>(e){   </span></li>    <li class=''><span>        </span><span class='keyword'>try</span><span>{   </span></li>    <li class='alt'><span>         xmlhttpreq=</span><span class='keyword'>new</span><span> activexobject(</span><span class='string'>"microsoft.xmlhttp"</span><span>);   </span></li>    <li class=''><span>         }</span><span class='keyword'>catch</span><span>(e){}   </span></li>    <li class='alt'><span>         }   </span></li>    <li class=''><span>        }   </span></li>    <li class='alt'><span>       }   </span></li>    <li class=''><span>  </span><span class='comment'>//发送请求函数 </span><span>  </span></li>    <li class='alt'><span>  </span><span class='keyword'>function</span><span> send(url){   </span></li>    <li class=''><span>   createxmlhttprequest();   </span></li>    <li class='alt'><span>   xmlhttpreq.open(</span><span class='string'>"get"</span><span>,url,</span><span class='keyword'>true</span><span>);   </span></li>    <li class=''><span>   xmlhttpreq.onreadystatechange=proce;   </span><span class='comment'>//指定响应的函数 </span><span>  </span></li>    <li class='alt'><span>   xmlhttpreq.send(</span><span class='keyword'>null</span><span>);  </span><span class='comment'>//发送请求 </span><span>  </span></li>    <li class=''><span>   }   </span></li>    <li class='alt'><span>  </span><span class='keyword'>function</span><span> proce(){   </span></li>    <li class=''><span>   </span><span class='keyword'>if</span><span>(xmlhttpreq.readystate==4){ </span><span class='comment'>//对象状态 </span><span>  </span></li>    <li class='alt'><span>    </span><span class='keyword'>if</span><span>(xmlhttpreq.status==200){</span><span class='comment'>//信息已成功返回,开始处理信息     </span><span>  </span></li>    <li class=''><span>                <!--测试读取xml开始-->   </span></li>    <li class='alt'><span>    </span><span class='keyword'>var</span><span> root=xmlhttpreq.responsexml;   </span></li>    <li class=''><span>    </span><span class='keyword'>var</span><span> res=root.getelementsbytagname(</span><span class='string'>"content"</span><span>)[0].firstchild.data;   </span></li>    <li class='alt'><span>    window.alert(res);    </span></li>    <li class=''><span>     <!--测试读取xml结束-->      </span></li>    <li class='alt'><span>    </span><span class='comment'>//var xmlreturn = xmlhttpreq.responsetext; </span><span>  </span></li>    <li class=''><span>    </span><span class='comment'>//window.alert(xmlreturn); </span><span>  </span></li>    <li class='alt'><span>    }</span><span class='keyword'>else</span><span>{   </span></li>    <li class=''><span>     window.alert(</span><span class='string'>"所请求的页面有异常"</span><span>);   </span></li>    <li class='alt'><span>     }   </span></li>    <li class=''><span>     }   </span></li>    <li class='alt'><span>     }   </span></li>    <li class=''><span>  </span><span class='comment'>//身份验证  </span><span>  </span></li>    <li class='alt'><span>  </span><span class='keyword'>function</span><span> check(){   </span></li>    <li class=''><span>   </span><span class='keyword'>var</span><span> name=document.getelementbyid(</span><span class='string'>"name"</span><span>).value;   </span></li>    <li class='alt'><span>       </span></li>    <li class=''><span>    </span><span class='keyword'>if</span><span>(name==</span><span class='string'>""</span><span>){   </span></li>    <li class='alt'><span>     alert(</span><span class='string'>"请输入姓名!"</span><span>);   </span></li>    <li class=''><span>     </span><span class='keyword'>return</span><span> </span><span class='keyword'>false</span><span>;   </span></li>    <li class='alt'><span>     }   </span></li>    <li class=''><span>     </span><span class='keyword'>else</span><span>{   </span></li>    <li class='alt'><span>      </span><span class='comment'>//send('login?name='+name);   </span><span>  </span></li>    <li class=''><span>      document.getelementbyid(</span><span class='string'>"load"</span><span>).style.display=</span><span class='string'>''</span><span>;       </span></li>    <li class='alt'><span>      send('login.</span><span class='keyword'>do</span><span>?name='+name);    </span></li>    <li class=''><span>      document.getelementbyid(</span><span class='string'>"load"</span><span>).style.display='none';             </span></li>    <li class='alt'><span>      }   </span></li>    <li class=''><span>     }   </span></li>    <li class='alt'><span>        </span></li>    <li class=''><span>  </script>   </span></li>    <li class='alt'><span> </head>   </span></li>    <li class=''><span>    </span></li>    <li class='alt'><span> <body>   </span></li>    <li class=''><span> <form action=</span><span class='string'>"login"</span><span> method=</span><span class='string'>"post"</span><span>>   </span></li>    <li class='alt'><span>  <table>   </span></li>    <li class=''><span>      <tr><td>姓名:&amp;nbsp;<input id=</span><span class='string'>"name"</span><span> type=</span><span class='string'>"text"</span><span> name=</span><span class='string'>"name"</span><span>/><p>   </span></li>    <li class='alt'><span>       <div id=load style=</span><span class='string'>"display:none; position:absolute;right:0px;top:0px;background:#ff5b5b;border:1px solid"</span><span>>正在验证用户名,请稍后……</div><p>   </span></li>    <li class=''><span>         <input type=</span><span class='string'>"button"</span><span> value=</span><span class='string'>"检测!"</span><span> onclick=</span><span class='string'>"check()"</span><span>/>   </span></li>    <li class='alt'><span>      </td>   </span></li>    <li class=''><span>     </tr>   </span></li>    <li class='alt'><span>     </table>   </span></li>    <li class=''><span>     </form>   </span></li>    <li class='alt'><span> </body>   </span></li>    <li class=''><span></html>   </span></li></ol>
0
9
分享到:
评论

相关推荐

    ajax+servelet无刷新显示用户名

    在这个例子中,用户注册时输入用户名,Ajax负责在后台验证用户名是否已被占用,无需等待整个页面刷新,提升了交互体验。 【描述】中的"Servlet"是Java Web开发中的一个重要组成部分,它是一个服务器端的Java小程序...

    jsp+ajax+servlet+jdbc案例

    在登录验证时,AJAX可以异步发送请求,获取服务器的验证结果,然后在页面上显示反馈,提升用户体验。 JDBC则是Java访问数据库的标准接口,提供了连接数据库、执行SQL语句和处理结果集的能力。在我们的系统中,JDBC...

    AJAX+servlet+jsp用户注册

    在Web开发中,AJAX(Asynchronous JavaScript and XML)是一种技术,它允许在不刷新整个页面的情况下与服务器交换数据并更新部分网页内容。本项目"AJAX+servlet+jsp用户注册"是为初学者设计的一个典型示例,旨在教授...

    html+Servlet+ajax实现登录修改

    在登录和修改场景中,AJAX可以发送异步请求到Servlet,获取验证结果,然后无刷新地更新页面显示。这避免了传统的表单提交方式,即页面必须完全刷新才能显示反馈信息,提高了用户体验。 具体实现上,JavaScript...

    Ajax+servlet实现登录和图书数据库的增删改查。

    在本项目中,Servlet将处理来自Ajax请求的业务逻辑,如验证登录信息,执行数据库操作等。 接下来,我们将深入到图书管理系统的具体实现步骤: 1. **登录功能**:用户在前端输入用户名和密码,这些信息通过Ajax异步...

    AJAX+servlet入门实例用户注册

    总结,AJAX与Servlet结合使用,可以在用户注册过程中提供流畅无刷新的体验,同时后台Servlet负责数据处理和存储,确保了系统的稳定性和安全性。通过不断学习和实践,开发者可以更好地掌握这两种技术,构建高效、交互...

    Ajax与servlet免刷新验证

    这个实例“Ajax与servlet免刷新验证”主要展示了如何利用Ajax实现用户输入数据的实时验证,而无需整个页面的刷新,提高了用户体验。 Ajax的核心在于其异步特性,它允许后台与服务器进行数据交换,而不会打断用户的...

    ajax+servlet登陆

    本项目“ajax+servlet登陆”着重探讨如何利用这两种技术实现一个无需刷新整个页面即可完成用户登录验证的功能,提高用户体验。 首先,我们需要理解Ajax的核心概念。Ajax并非一种单一的技术,而是一种使用JavaScript...

    Spring+ajax+servlet异步完成登录名是否存在

    本文将深入探讨如何使用Spring、Ajax和Servlet实现登录名存在的异步检查,从而在用户输入时实时验证用户名是否已被占用,避免用户等待服务器返回完整的登录页面。我们首先会介绍相关技术的基本概念,然后逐步解析...

    SAAS聊天室 AJAX+SERVLET+MYSQL

    【描述】:“AJAX+SERVLET+MYSQL实现SAAS聊天室”是指利用AJAX技术进行页面无刷新交互,Servlet作为服务器端处理逻辑,以及MySQL数据库存储数据,共同构建一个基于Software as a Service (SAAS)模式的在线聊天室系统...

    Ajax+Jsp+mysql+servlet实现验证注册以及省市联动

    当接收到请求时,Servlet将调用数据库查询方法,验证用户名是否已存在,或根据省的选择动态加载市的选项。 4. **Ajax通信**:使用Ajax的`XMLHttpRequest`对象或者jQuery的`$.ajax()`函数,向Servlet发送GET或POST...

    基于jsp+servlet+Ajax异步登陆模拟web项目

    在登录场景下,Servlet负责接收来自JSP的登录请求,验证用户名和密码,然后返回验证结果。Servlet运行在服务器端,处理业务逻辑,提高了系统的可扩展性和可维护性。 Ajax的核心在于能够在不刷新整个页面的情况下,...

    JSP+SERVLET+AJAX网上书城

    这部分可能使用了JSP进行表单设计,Servlet处理提交的表单数据,包括验证用户名的唯一性、密码的安全性等。 2. **书城管理模块**: - 后台管理:管理员可以添加、删除、修改和查询书籍信息,这些操作可能通过...

    bootstrapValidator+Servlet+jsp 用户名remote检验存在

    在这个项目中,“bootstrapValidator+Servlet+jsp 用户名remote检验存在”表明我们正在使用这些技术来验证用户名的唯一性,通过远程服务器请求来检查该用户名是否已被其他用户占用。以下是对这个知识点的详细解释: ...

    AJAX+servlet实例入门,搞定AJAX简单易学

    1. **用户输入验证**:使用AJAX实时验证用户输入,如邮箱格式、用户名可用性等,无需每次输入都提交表单。 2. **动态加载内容**:如分页、无限滚动、下拉刷新等,只更新部分页面内容,提高加载速度。 3. **异步提交...

    ajax_servlet检查用户名是否可用

    public class AjaxServlet extends HttpServlet { @Override protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String username = ...

    easyui+ajax+json+servlet实现用户登录注册简单demo

    在这个例子中,Servlet接收来自Ajax请求的数据(即JSON对象),验证用户信息(例如,检查用户名是否存在,密码是否正确),然后返回相应的响应。如果验证成功,Servlet可能会返回一个表示登录成功的消息;如果失败,...

    jsp+servlet+ajax实现登录

    Servlet接收这些数据,验证用户名和密码的正确性,然后可能与数据库进行交互,以确认用户的身份。 DBCP(Database Connection Pool)是Apache提供的一个数据库连接池组件。数据库连接池在初始化时会创建一定数量的...

    基于jsp+servlet+ajax的web聊天室

    使用servlet+ajax实现无刷新发言与更新实时聊天记录以及注册时文本框失去焦点AJAX验证用户名是否已重复; 系统支持双人聊天与群聊,群聊登陆界面为webLogin.jsp 双人聊天为login.jsp。在注册以后均可以登陆系统进行...

    servlet+mysql+jsp+ajax 注册 登陆 查询 修改 的简单demo

    在登录或注册过程中,Ajax可以实现无刷新验证,提高用户体验。例如,当用户输入用户名并提交时,前端JavaScript会通过Ajax向服务器发送请求,检查用户名是否已存在。如果服务器返回该用户名已被占用,Ajax回调函数会...

Global site tag (gtag.js) - Google Analytics