中文字幕理论片,69视频免费在线观看,亚洲成人app,国产1级毛片,刘涛最大尺度戏视频,欧美亚洲美女视频,2021韩国美女仙女屋vip视频

打開APP
userphoto
未登錄

開通VIP,暢享免費(fèi)電子書等14項(xiàng)超值服

開通VIP
使用jquery實(shí)現(xiàn)用戶名驗(yàn)證
第一:注冊(cè)頁面代碼
 
<%@ page language="java" contentType="text/html; charset=GBK"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link href="css/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="jslib/jquery.js"></script>
<script type="text/javascript" src="jslib/function.js"></script>
<title>測(cè)試用戶名表單輸入</title>
</head>
<body>
<input type="hidden" name="tmp" id="tmp" value="" />
<table>
<!--用戶名的處理 Start-->
    <tr>
       <td>用戶名:<input type="text" id="username"></td>
       <td><input type="button" value="檢測(cè)" onclick="verify()"></td>
       <td>
        <!--正常提示 Start-->
              <!-- class屬性用于連接css  -->
                <div id="div_uname_rule" class="name-pop">
                         ¡¤6~18個(gè)字符,包括字母、數(shù)字、下劃線<br>
                         ¡¤字母開頭,字母和數(shù)字結(jié)尾,不區(qū)分大小寫<br>
                </div>
          <!--正常提示 End-->
          <!--錯(cuò)誤提示 Start-->
                 <div id="div_uname_err_info" class="name-pop"></div>  
          <!--錯(cuò)誤提示 End-->
          </td>
    </tr>
<!--用戶名的處理 End-->
    <tr>
       <td>密碼 <input type="text" id="password"></td>
    </tr>
</table>
</body>
 
第二:css代碼(如果大家想設(shè)計(jì)的漂亮一些,需要在此多下些功夫,我只簡(jiǎn)單的設(shè)計(jì)了一個(gè))
div.name-pop{
 background-color:#EDEDEB;
 position:absolute;
 height:auto;
 left:310px;
 top:14px;
 width:320px;
 border: 1px red solid;
 display:none;
 padding-left:5px;
 padding-top:5px;
 padding-bottom: 5px;
 padding-right: 5px
}
 
第三:function.js代碼
function chkUsername() {
 var username = $.trim($("#username").val());
 if(username=="") {
  return 0;
 }
 else if( /^\d.*$/.test( username ) ){
  //用戶名不能以數(shù)字開頭
  return -1;
 }
 else if(username.length<6 || username.length>18 ){
  //合法長度為6-18個(gè)字符
  return -2;
 }
  else if(! /^\w+$/.test( username ) ){
  //用戶名只能包含_,英文字母,數(shù)字
   return -3;
 }
 else if(! /^([a-z]|[A-Z])[0-9a-zA-Z_]+$/.test( username ) ){
  //用戶名只能英文字母開頭
  return -4;
 }
 else if(!(/[0-9a-zA-Z]+$/.test( username ))){
  //用戶名只能英文字母或數(shù)字結(jié)尾
  return -5;
 }
  return 1;
}
$(document).ready(function(){
  /** ----------- 用戶名輸入框事件 ----------- */
  //當(dāng)文本框成為焦點(diǎn)時(shí)
  $("#username").bind("focus", function(){
  var ret=chkUsername();
  if(ret==0){
  //用戶名輸入框?yàn)榭?顯示規(guī)則
   $("#div_uname_err_info").hide();
   $("#div_uname_rule").show(); 
  }
  return false;
  });
 
  //當(dāng)文本框失去焦點(diǎn)時(shí)
  $("#username").bind("blur", function(){
   var ret=chkUsername();
   $("#div_uname_rule").hide();
   $("#div_uname_err_info").show();
   if (ret>0){
    var url="testServlet?name="+$("#username").val();
    $.get(url,null,callback);
   }
   else if(ret==0){
   //用戶名輸入框?yàn)榭?顯示規(guī)則
    $("#div_uname_err_info").html("用戶名不能為空");  
   }
  else {
   
    if(ret == -1){
     //顯示具體的錯(cuò)誤內(nèi)容
     $("#div_uname_err_info").html("用戶名不能以數(shù)字開頭");
    }
    else if(ret == -2){
     $("#div_uname_err_info").html("合法長度為6-18個(gè)字符");
    }
    else if(ret == -3){
     $("#div_uname_err_info").html("用戶名只能包含_,英文字母,數(shù)字 ");
    }
    else if(ret == -4){
     $("#div_uname_err_info").html("用戶名只能英文字母開頭");
    }
    else if(ret == -5){
     $("#div_uname_err_info").html("用戶名只能英文字母或數(shù)字結(jié)尾");
    }
  }
  
   return false;
  });
});
  function verify(){
   var ret=chkUsername();
   if (ret>0){
   var url="testServlet?name="+$("#username").val();
   $.get(url,null,callback);    //將文本框 中的數(shù)據(jù)發(fā)送到頁面上
   }
  }
  //接收服務(wù)器返回的數(shù)值,將服務(wù)器返回的數(shù)據(jù)動(dòng)態(tài)的顯示在頁面上
  function callback(data){
   var resultObj=$("#div_uname_err_info");
   resultObj.html(data);
  }
  
 
 
第四:編寫servlet,我簡(jiǎn)寫了,只做測(cè)試用
 
 
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 testServlet extends HttpServlet {
 /**
  *
  */
 private static final long serialVersionUID = -416104398788674508L;
 public void doGet(HttpServletRequest request, HttpServletResponse response)
   throws ServletException, IOException {
  response.setContentType("text/html;charset=GBK");
  String name=request.getParameter("name");
  PrintWriter out=response.getWriter();
  if (name.equals("hanmei")){
   out.println("用戶名"+name+"已存在");
  }else{
   out.println("用戶名"+name+"不存在,可以使用");
  }
 
 }
 public void doPost(HttpServletRequest request, HttpServletResponse response)
   throws ServletException, IOException {
  doGet(request,response);
 }

}
 
第五:修改web.xml文件
 
打開APP,閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
收集48條常用正則式
PHP編程技巧:看實(shí)例學(xué)正則表達(dá)式
域名命名規(guī)則
Word查找替換—3個(gè)批量實(shí)用小技巧!
JAVA 正則表達(dá)式、漢字正則、 java正則代碼
Javascript正則表達(dá)式使用
更多類似文章 >>
生活服務(wù)
熱點(diǎn)新聞
分享 收藏 導(dǎo)長圖 關(guān)注 下載文章
綁定賬號(hào)成功
后續(xù)可登錄賬號(hào)暢享VIP特權(quán)!
如果VIP功能使用有故障,
可點(diǎn)擊這里聯(lián)系客服!

聯(lián)系客服