用户注册----Ajax验证(升级版)

Form.html

<html>

  <head>

   <title>表单验证</title> 

   <meta http-equiv="content-type" content="text/html; charset=UTF-8">

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

   <script type="text/javascript">

      function formcheck(){       

        var url="formcheck";

        var userid=document.getElementById("userid").value;

        var userpwd=document.getElementById("userpwd").value;

        var params="userid="+userid+"&userpwd="+userpwd;

        sendRequest(url,params,'POST',showresult);   

    }

    function showresult(){

        if (httpRequest.readyState == 4) {

            if (httpRequest.status == 200) {

                var info=httpRequest.responseText;

                document.getElementById("result").innerHTML=info;

            }

        }

}

function checkpassword(){

        var password = document.getElementById("userpwd").value;

        var repassword = document.getElementById("userpwd1").value;

        if(password == ""){

          alert("请输入密码");

          document.getElementById("password").focus();

          return ;

        }

       

        if(password != repassword){

         alert("输入的密码不一致,请重新输入");

          document.getElementById("password").focus();

        }

}

function checkage(){

         var age = document.getElementById("age").value;

         if(age<10||age>30){

         alert("输入年龄范围应该为10岁至30");

         document.getElementById("age").focus();

         return false;

         }

         }

</script>

  </head>

  <body>

  <h1 align="center"><font color="red">用户注册</font></h1>

  <form action="">

 <table border="0" align="center" width="600"> 

<tr><td align="right">用户名:</td>

<td><input type="text" name="userid" id="userid" onblur="formcheck()"/></td>

</tr>

<tr><td align="right">性别:</td>

<td><input type="radio" name="userSex" value=""/>

    <input type="radio" name="userSex" value=""/></td>

</tr>

<tr><td align="right">密码:</td>

    <td><input type="password" name="userpwd"  id="userpwd"/></td>

</tr>

<tr><td align="right">确认密码:</td>

    <td><input type="password" name="userpwd" id="userpwd1" onblur="checkpassword()"/></td>

</tr>

<tr><td align="right">年龄:</td>

    <td><input type="text" name="age" id="age" onblur="checkage()"/></td>

</tr>

<tr><td colspan="3" align="center" height="40">

<input type="button" value="注册" onclick="formcheck()"/>

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

</td>

</tr>

      </table>

    </form>  

  </body>

</html>

FormCheck.java

package servlers;

 

import java.io.IOException;

import java.io.PrintWriter;

 

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

 

public class FormCheck extends HttpServlet {

 

    public void doPost(HttpServletRequest request, HttpServletResponse response)

            throws ServletException, IOException {

        response.setContentType("text/html;charset=UTF-8");

        PrintWriter out = response.getWriter();

        request.setCharacterEncoding("UTF-8");

        String userid=request.getParameter("userid");

        if("XXX".equals(userid)){

            out.print("用户名已存在");

        }  

    }

}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值