使用AJAX進行表單驗證

我正在創建一個包含3個輸入字段（用戶名，密碼和密碼登錄）的登錄表單。使用AJAX進行表單驗證

Looks something like this:

正如你所看到的，我使用AJAX在客戶端驗證直接登錄。

var username = document.getElementById("username").getElementsByTagName("input")[0]; 
username.onfocus = function(){ 
    this.className = "thinking"; 
} 
username.onblur = validateUsername;

以及類似的密碼。提交按鈕在默認情況下處於禁用狀態，並且只有在兩個字段都被驗證後才能啓用。

這是我的問題：輸入用戶名並點擊[Tab]按鈕後，我的PHP腳本會驗證用戶名並顯示綠色標記，如圖所示。但是當我輸入密碼時，用戶將不得不手動點擊其他地方來觸發'onblur'事件並執行密碼驗證，這不是非常直觀和吸引人的。密碼檢查應該在焦點仍然在密碼字段上時完成，這意味着當用戶開始輸入密碼時，應該觸發一個事件，並且當他完成鍵入時，應該觸發另一個事件。我應該怎麼做呢？

謝謝！

來源

2015-06-03 Suyash Shetty

答案就在於這個問題。我也用它http://stackoverflow.com/questions/14042193/how-to-trigger-an-event-in-input-text-after-i-stop-typing-writing –

如何使用'onkeydown'與一個小延遲？ –

'onkeyup'更好。 –

您正在使用的onblur事件，這意味着，只有當現場將留下不聚焦，當你按下[Tab]鍵正在發生的事情就會被觸發。爲了在密碼字段上觸發onBlur事件，您必須再次按[Tab]鍵。您還可以使用具有默認驗證的HTML5 input tags。如果你想在用戶輸入時觸發一個事件，那麼你可以使用keyup和keydown事件。如果您想在用戶開始輸入時專門觸發一個事件，而當他完成一個事件時，您必須假定他需要一些時間進行輸入。看看example。

來源

2015-06-03 07:31:28 Tarun

謝謝！這工作。 –

使用AJAX進行表單驗證

回答

相關問題