關於用戶名驗證的JQuery .ajax（）

我試圖用以下代碼驗證用戶名是否存在或不存在。但它以某種方式不起作用，以防止現有的用戶名。 **注意：checkusr2.php是一個簡單的php來檢查數據庫中的用戶名。關於用戶名驗證的JQuery .ajax（）

function verifyUser() { 
    var usr = $("#username").val(); 
    $.ajax({ 
     type: "POST", 
     url: "checkusr2.php", 
     data: "username="+ usr, 
     success: function(msg) { 
      $("#txtHint").ajaxComplete(function(event, request, settings){ 
       FormErrors = false; 
       if(msg == 'OK') { 
        FormErrors = true; 
        $('#formElem').data('username',FormErrors); 
       } else { 
        $('#formElem').data('username',FormErrors); 
       } 
      }); 
     } 
    }); 
}

/**調用函數進行檢查。 **/

verifyUser(); 
if($('#formElem').data('username')){ 
    alert('Username exist, please try another username.'); 
    return false; 
}

來源

2011-01-11 Eric T

發佈PHP代碼。 – 2011-01-11 18:01:07

使用像Charles，Fiddler，WireShark等http代理來查看您發送的ajax請求並驗證響應是否您期望的。

首先，您正在進行異步調用（Ajax中的A）以獲取用戶名是否存在的響應。在您調用verifyUser後立即調用verifyUser調用後立即執行檢查，並且checkusr2.php的請求可能實際上可能已經返回，也可能沒有實際返回。

我也從來沒有見過成功處理程序中的ajaxComplete集。我想你可能要改變這樣的：

function verifyUser() { 
    var usr = $("#username").val(); 
    $.ajax({ 
     type: "POST", 
     url: "checkusr2.php", 
     data: "username="+ usr, 
     success: function(msg) { 
      if(msg != 'OK') { 
       alert('Username exists, please try another username.'); 
       $("#username").val(""); 
      } 
     }; 

    }); 
}

來源

2011-01-11 18:04:08 sberry

謝謝一堆。它完美的作品。我會嘗試那些http代理你推薦^^ – 2011-01-11 18:29:49

你的問題是試圖同步使用verifyUser。代碼看起來相當合理，問題是$ .ajax使用XMLHTTPRequest異步執行。這意味着您的代碼緊跟在調用verifyUser之後不能依賴於其完成的副作用。

你需要做的是早些時候運行verifyUser回調（比如說，當用戶不關注用戶名字段時），這樣當提交時你已經得到了結果。

例如：

$('#username').blur(function() { verifyUser() });

進一步的變化將是預防，而不是提交，就可以使verifyUser顯示一個div消息字段旁邊當用戶名無效。你會做出這些改變你的處理程序：

  if(msg == 'OK') { 
       FormErrors = true; 
       $('#username_invalid').show(); 
      } else { 
       $('#username_invalid').hide(); 
      }

然後，你可以顯示用戶名不能立即選擇用戶，而無需浪費時間提交。

來源

2011-01-11 18:02:46 Crast

試試這個

$("#txtHint").ajaxComplete(function(e, xhr, settings) { 
    if (settings.url == 'ajax/test.html' && xhr.responseHTML=="Ok") { 
       FormErrors = true; 
       $('#formElem').data('username',FormErrors); 
      } else { 
       $('#formElem').data('username',FormErrors); 
      } 
})

來源

2011-01-11 18:08:19 Wazzzy

謝謝你帶了這個.ajaxComplete（），我不知道。我認爲這對我將來會有很大的幫助。
但無論如何，我不認爲這是你想要在這種特殊情況下使用什麼：

function verifyUser() { 
    var usr = $("#username").val(); 
    $.ajax({ 
    type: "POST", 
    url: "checkusr2.php", 
    data: {'username':usr}, 
    success: function(msg) { 
     if (msg != 'OK') { 
     alert('Username exist, please try another username.'); 
     return false; 
     } 
    }); 
    }); 
}

要執行後Ajax調用必須作爲Ajax功能的回調來傳遞的功能，否則，即使將它放在Ajax函數之後，它也會在服務器響應之前執行。

來源

2011-01-11 18:15:30 Nabab

感謝您的快速和準確的響應。 – 2011-01-11 18:34:09

關於用戶名驗證的JQuery .ajax（）

回答

相關問題