ajax實現驗證使用者名稱是否已經存在（struts2）

阿新 • • 發佈：2019-01-11

在使用者進行註冊的時候，為了保證使用者名稱的唯一性，需要在使用者註冊時進行使用者名稱的驗證，這個使用AJAX實現無重新整理驗證是最合適的。
下面就是我的驗證原始碼，在程式碼中通過註釋講解用法。
1.jsp頁面：

 <table>
            <tr>
                <td>賬號</td>
                <td><input name="accountNumber" type="text" id="uname" />
                	<div id="showResult"></div>
                </td>
            </tr>
</table>

2.js程式碼（Ajax程式碼）：
這裡用的是Jquery的ready方法，在頁面完全載入後會呼叫ready方法，注意ready方法不應該和與<body onload=""> 一起使用。

<script type="text/javascript">
  $(document).ready(function(){   
    var inputUserNameObj = $("#uname");   //將獲取ID為uname的控制元件的物件
  
	$("#uname").blur(function(){   //當該控制元件失去焦點時發生

		var text = inputUserNameObj.val();   //獲得使用者輸入的使用者名稱
                             
		$.post("member_CheckAccounterNumber.action?accounterNumber="+text,null,function(response){    
                   //以POST方式跳轉到action裡面的方法中進行處理，並返回處理結果response

			 if(response=="使用者名稱已經存在"){ //根據返回值進行處理
			            
				document.getElementById("uname").focus();//使用者名稱輸入控制元件獲得焦點
				           
			        document.getElementById("showResult").innerHTML="<font color='red'>"+response+"</font>"; 
                                //在div中提示使用者該使用者名稱已經存在

			 }else{
				if(document.getElementById("uname").value=="") //判斷使用者名稱是否為空
				{
				document.getElementById("showResult").innerHTML="<font color='red'>"+"使用者名稱不為空"+"</font>";
                                 //在div中提示使用者該使用者名稱不能為空

	 			document.getElementById("uname").focus();//使用者名稱輸入控制元件獲得焦點

				}else{

		             	 document.getElementById("showResult").innerHTML="<font color='blue'>"+response+"</font>"; 
                                 //在div中提示使用者該使用者名稱可用
		             }
			}
	 	});  
	});   
});
</script><pre name="code" class="plain">

3.action程式碼：

private String accounterNumber;
	
	public String getAccounterNumber() {
		return accounterNumber;
	}

	public void setAccounterNumber(String accounterNumber) {
		this.accounterNumber = accounterNumber;
	}
    <span style="white-space:pre">	</span>//Ajax驗證使用者名稱，防止重複
	public void CheckAccounterNumber()
	{
		//查詢該使用者名稱是否存在
		mUserRole=userbiz.queryMemberUserInfobyAccountName(accounterNumber);
		
		//設定響應編碼UTF-8，防止中文亂碼
		res.setContentType("text/html;charset=UTF-8");   
		  
		if(mUserRole!=null)//判斷是否存在
		{
		try {
			res.getWriter().write("使用者名稱已經存在");

		} catch (IOException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
		}
		else
		{
		try {
			res.getWriter().write("此使用者名稱可用");

		} catch (IOException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
		}
	}
	
}

效果圖展示：

ajax實現驗證使用者名稱是否已經存在（struts2）

在使用者進行註冊的時候，為了保證使用者名稱的唯一性，需要在使用者註冊時進行使用者名稱的驗證，這個使用AJAX實現無重新整理驗證是最合適的。下面就是我的驗證原始碼，在程式碼中通過註釋講解用法。1.js

rails4 ajax實現驗證使用者存在否

假設使用者表名是 users ，使用者名稱欄位是 name 1、需為users對應的建一個controller，同時定義方法checkname app\controllers\users_controller.rb class UsersController <

Nginx+Memcache+一致性hash算法實現頁面分布式緩存（轉）

tps ons efi 策略可擴展性 master () list roo 網站響應速度優化包括集群架構中很多方面的瓶頸因素，這裏所說的將頁面靜態化、實現分布式高速緩存就是其中的一個很好的解決方案... 1）先來看看Nginx負載均衡 Nginx負載均衡依賴自帶的 ng

Ajax實現驗證碼非同步校驗

驗證碼非同步校驗可以防止表單提交後因驗證碼不正確導致已填的其它項都清空。整個過程圖如下驗證碼輸入框出程式碼 1 <div class="form-group"> 2 <label for="date" class="col-sm-2 control-label

jsp註冊頁面，Ajax實現驗證使用者名稱是否存在，密碼是否一致，當不存在時，註冊按鈕變成灰色。

Qt實現截屏並保存（轉載）

提示信息讓我介紹 etime widget core 親測 log ring 原博地址：http://blog.csdn.net/qinchunwuhui/article/details/52869451?_t_t_t=0.28889142944202306 目前對應用

AJAX實現圖片上傳和預覽（傳統ajax與jQuery AJAX；帶圖片的表單提交）

一、通過Servlet3.0和傳統的AJAX實現圖片上傳和預覽此方法也適用於帶圖片的表單提交上傳時預覽圖片

S實現表單內容驗證、阻止表單提交（onsubmit）

onsubmit屬性只在 <form> 表單中使用。 onsubmit事件是當表單提交時進行相關JS操作的一個事件。 onsubmit事件會在表單中的確認按鈕被點選時發生。當該事件觸發的函式中返回false時，表單就不會被提交。 <!DOCTYPE h

Javascript實現ajax提交form表單到xml檔案（Javaweb）

（1）ajax實現非同步資料傳輸的原理：當我們使用ajax技術通過頁面與伺服器交換資料的時候，web ui實際上是將請求交給了ajax引擎去處理。這樣就使得ajax引擎充當了中轉站的角

JS實現表單內容驗證、阻止表單提交（onsubmit）

onsubmit屬性只在 <form> 表單中使用。 onsubmit事件是當表單提交時進行相關JS操作的一個事件。 onsubmit事件會在表單中的確認按鈕被點選時發生。當該事件觸發的

mybaties的緩存（轉）

exception hiberna 通過 cti pan 問題 -- name namespace 內容大綱.png 前言本篇意在通過Hibernate和Mybaitis緩存,通過對比學習,同時弄懂這兩者中的區別 Hibernate中的緩存 Hibernate中一般常

【推薦系統實戰】：C++實現基於用戶的協同過濾（UserCollaborativeFilter）

color style popu ted std 相似度 abi ear result 好早的時候就打算寫這篇文章，可是還是參加阿裏大數據競賽的第一季三月份的時候實驗就完畢了。硬生生是拖到了十一假期。自己也是醉了。。。找工作不是非常順利，希望寫點東西回想一下知識。然後再

《大話設計模式》——讀後感（8）好菜每回味不同——建造者模式之基礎案例（1）

ted builds src ret 分離 args 類圖 rec 方法建造者模式：是將一個復雜的對象的構建與它的表示分離，使得同樣的構建過程可以創建不同的表示。建造者模式通常包括下面幾個角色： 1. builder：給出一個抽象接口，以規範產品對象的各個組成成分的

關於構建二維動態內存（堆）及釋放

動態內存 size alloc spa pre all class ++ for 分配一維的內存堆可以直接用malloc及free，關於二維有如下方法： a=(int**)malloc(sizeof(int*)*m); for(i=0;i<m;i

PHP實現RESTful風格的API實例（一）

request restful ref turn function 數據操作 dex 進行所有（關於Yii2的RESTful教程請看： Yii2框架RESTful API教程）最近看了一些關於RESTful的資料，自己動手也寫了一個RESTful實例，以下是源碼

Java系列講座二：Socket網絡通信實現聊天軟件項目講解（UDP）

tcp 網絡通信 udp socket 上一篇我們講了通過TCP方式實現網絡通信軟件開發的原理，思路及實現，今天跟大家談談Socket通信中UDP方式通信的軟件開發步驟及主要代碼講解，UDP實現方式實現的通信軟件特點是不分客戶端與服務器端，一個程序既是客戶端與是服務器端，典型軟件是一些

Linux內核管理--內存（一）

內核1）Linux把空閑的物理內存劃出一部分用作buffer,cache2）buffer cache是高速緩存環從，目的是為了解決磁盤讀取速度遠小於內存這個問題，cpu從內存直接讀取最快；3）但是物理內存有限，不可能所有數據都在物理內存，swap交換分區就出現了，內核會根據“”最近經常使用“”算法，把不經常使

ios 清理緩存（EGO）

ios suse nsf light err ask nsstring article bject 一段清理緩存的代碼例如以下： dispatch_async( dispatch_get_global_queue(DISPATCH_QUEUE_PRIORIT

mvc ---- ajax 提交過來的Json格式如何處理（解析）

soft sta mvc custom alt 提交 urn ima blog 前臺傳過來的不是一個對象，而是一個Json字符串怎麽辦？如： {"fids":"2323","contents":"<p>lsdfjlsdjflsdf</p>

JVM手動分配內存（轉載）

permsize pri 轉載決定項目新生代棧幀 maxperm 獨立原文內容很詳細，不利於快速瀏覽，所以只保留了重點原文地址 http://blog.csdn.net/mr__fang/article/details/47723767 內存檢測工具jvisua

ajax實現驗證使用者名稱是否已經存在（struts2）

相關推薦