ajax 登录验证

来源:互联网 发布:手机抢答软件 编辑:程序博客网 时间:2024/05/10 08:58

  1. 使用jquery框架:下载jquery.js
  2. 新建一个web工程ajax
  3. webRoot下新建一个jslib文件夹:专门存放js文件;
  4. webRoot下新建一个html/jsp页面:login.html

   

<script type="text/javascript" src="jslib/jquery.js" ></script>

<script type="text/javascript" src="jslib/verify.js"></script> 

</head>

<body>

  <h1>用户校验</h1>

  <!--ajax中可以不用form表单的提交-->

  <!--input标签中不需要用name属性,只用id属性就行了-->

  <!--id属性是为了使用dom-->

      <input type="text" id="username" /><br />

      <input type="button"value=" 校验 " onclick="verify()"/>

  <!--div为空是为了存放服务器返回的信息-->

     <div id="result"></div>

</body>




  1. jslib下新建一个js文件:verify.js

  

 

function verify()

        {

         var paramObj=encodeURI(encodeURI($("#username").val()));

         $.get("TestSvlt?username="+paramObj,null,callback);

        }

  function callback(data)

        {

            var resultObj=$("#result");

            resultObj.html(data);

       }


 

  1. 新建一个servletAjaxLogin类;在doGet方法中写
  2. response.setContentType("text/html;charset=utf-8");

            PrintWriter out=response.getWriter();

            String name=request.getParameter("username");

            String username= URLDecoder.decode(name,"UTF-8");

            System.out.println(username);

             if(null==username||"".equals(username))

             {

                 out.print("username is not null");

             }

            else

             {

                 if(!"lej".equals(username))

                 {

                     out.print(username+" not existing");

                 }

                 else{

                     out.print(username+"  loginsuccesss");

                 }

            }

  

 

原创粉丝点击