所以我想在用户输入4个字符时运行ajax，而不是当用户单击/按下提交按钮时，所以我必须删除这一行:
form.on('submit', function(e){
但在这种情况下，我会得到一个错误。我的代码:
$('#passwordField').keyup(function () {
if (this.value.length == 4) {
$(function(){
var form = $('#login-form');
if(form.is('.loading, .loggedIn')){
return false;
}
var user = form.find('#usernameField').val(),
messageHolder = form.find('#usernameErrorContainer');
var pass = form.find('#passwordField').val(),
messageHolder = form.find('#passErrorContainer');
e.preventDefault();
$.post(this.action, {user: user}, function(m){
if(m.error){
form.addClass('error');
messageHolder.text(m.message);
}
else{
form.removeClass('error').addClass('loggedIn');
messageHolder.text(m.message);
}
});
$.post(this.action, {pass: pass}, function(p){
if(m.error){
form.addClass('error');
messageHolder.text(p.message);
}
else{
form.removeClass('error').addClass('loggedIn');
messageHolder.text(p.message);
}
});
$(document).ajaxStart(function(){
form.addClass('loading');
});
$(document).ajaxComplete(function(){
form.removeClass('loading');
});
});
}
});
}
});
})
对于这个应用程序，我不需要任何安全措施，所以请不要让我阅读有关安全的文章。
编辑:实际形式:
<form id="login-form" name="login-form" action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>" method="post">
<input type="text" id="usernameField" name="username" maxlength="4" placeholder="username">
<input type="password" id="passwordField" maxlength="4" name="password" placeholder="password">
<span id="usernameErrorContainer"></span>
<span id="passErrorContainer"></span>
</form>
问题是当您将form.submit更改为keyup时，您也忘记更改其他元素。例如,你的匿名函数中仍然有e.preventDefault，这将抛出一个错误，因为e不在函数中，要修复它，请将e.preventDefault置于匿名函数之外或删除它，因为它没有做任何事情。也所有你的form变量都假设你是使用纯JS创建的变量，但你实际上是使用jquery创建它，像这样:var form = $('#login-form');你需要把它改成:var form = document.getElementById("login-form");