Javascript jQueryAjax验证部分有效
这是我的代码:Javascript jQueryAjax验证部分有效,javascript,jquery,validation,Javascript,Jquery,Validation,这是我的代码: $(function() { var name = $( "#name" ), email = $( "#email" ), password = $( "#password" ), allFields = $( [] ).add( name ).add( email ).add( password ), tips = $( ".validateTips" )
$(function() {
var name = $( "#name" ),
email = $( "#email" ),
password = $( "#password" ),
allFields = $( [] ).add( name ).add( email ).add( password ),
tips = $( ".validateTips" );
function updateTips( t ) {
tips
.text( t )
.addClass( "ui-state-highlight" );
setTimeout(function() {
tips.removeClass( "ui-state-highlight", 1500 );
}, 500 );
}
function checkLength( o, n, min, max ) {
if ( o.val().length > max || o.val().length < min ) {
o.addClass( "ui-state-error" );
updateTips( "Length of " + n + " must be between " +
min + " and " + max + "." );
return false;
} else {
return true;
}
}
function checkRegexp( o, regexp, n ) {
if ( !( regexp.test( o.val() ) ) ) {
o.addClass( "ui-state-error" );
updateTips( n );
return false;
} else {
return true;
}
}
function ajaxValidate(type,fval,n) {
//alert(type+" "+fval.val()+" "+n);
$.ajax({
type: "GET",
url: "ajaxValidate.php",
data: "type="+type+"&q="+escape(fval.val()),
success: function(msg){
if (msg != "") {
fval.addClass( "ui-state-error" );
updateTips( n );
return false;
}
else {
return true;
}
}
});
}
$( "#dialog-form" ).dialog({
autoOpen: false,
height: 540,
width: 420,
modal: true,
buttons: {
"Create an account": function() {
var bValid = true;
allFields.removeClass( "ui-state-error" );
bValid = bValid && checkLength( name, "username", 3, 16 );
bValid = bValid && checkLength( email, "email", 6, 80 );
bValid = bValid && checkLength( password, "password", 5, 16 );
bValid = bValid && ajaxValidate("user", name,"Username is taken");
bValid = bValid && ajaxValidate("email", email,"Email address is taken");
bValid = bValid && checkRegexp( name, /^[a-z]([0-9a-z_])+$/i, "Username may consist of a-z, 0-9, underscores, begin with a letter." );
// From jquery.validate.js (by joern), contributed by Scott Gonzalez: http://projects.scottsplayground.com/email_address_validation/
bValid = bValid && checkRegexp( email, /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i, "eg. john.doe@pokermaps.org" );
bValid = bValid && checkRegexp( password, /^([0-9a-zA-Z])+$/, "Password field only allow : a-z 0-9" );
if ( bValid ) {
$( "#users tbody" ).append( "<tr>" +
"<td>" + name.val() + "</td>" +
"<td>" + email.val() + "</td>" +
"<td>" + password.val() + "</td>" +
"</tr>" );
document.forms["regform"].submit();
$( this ).dialog( "close" );
}
},
Cancel: function() {
$( this ).dialog( "close" );
}
},
close: function() {
allFields.val( "" ).removeClass( "ui-state-error" );
}
});
$( "#create-user" )
.button()
.click(function() {
$( "#dialog-form" ).dialog( "open" );
});
});
对函数的调用如下所示:
function ajaxValidate(fval1,fval2,n) {
//alert(type+" "+fval.val()+" "+n);
$.ajax({
type: "GET",
url: "ajaxValidate.php",
data: "?email="+escape(fval1.val())+"&user="+escape(fval2.val()),
success: function(msg){
alert(fval1.val());
alert(msg);
}
});
}
bValid = bValid && ajaxValidate(email, name ,"Email/User address is taken");
require_once('classes/db/conn.php');
$user = $_GET['user'];
$email = $_GET['email'];
$query_user = mysql_fetch_array(mysql_query("SELECT USR_ID FROM users WHERE USR_Username = '$user'"));
$query_email= mysql_fetch_array(mysql_query("SELECT USR_ID FROM users WHERE USR_Email = '$email'"));
echo("SELECT USR_ID FROM users WHERE USR_Email = " . $email);
ajaxValidate.php如下所示:
function ajaxValidate(fval1,fval2,n) {
//alert(type+" "+fval.val()+" "+n);
$.ajax({
type: "GET",
url: "ajaxValidate.php",
data: "?email="+escape(fval1.val())+"&user="+escape(fval2.val()),
success: function(msg){
alert(fval1.val());
alert(msg);
}
});
}
bValid = bValid && ajaxValidate(email, name ,"Email/User address is taken");
require_once('classes/db/conn.php');
$user = $_GET['user'];
$email = $_GET['email'];
$query_user = mysql_fetch_array(mysql_query("SELECT USR_ID FROM users WHERE USR_Username = '$user'"));
$query_email= mysql_fetch_array(mysql_query("SELECT USR_ID FROM users WHERE USR_Email = '$email'"));
echo("SELECT USR_ID FROM users WHERE USR_Email = " . $email);
现在,在我提交表单之后,我应该会收到一个关于填写的电子邮件的警报,以及一个关于ajax响应内容的警报,这应该是来自$\u GET var的电子邮件的sql查询
我得到的是,在第一个警报中,我得到了正确的电子邮件地址,在第二个警报中,我得到了整个查询,但没有电子邮件地址。从接收USR\U电子邮件的用户中选择USR\U ID=
我快疯了,我搞不懂 ajaxValidate函数不显式返回任何内容,因此它隐式返回未定义的内容,然后将其转换为布尔值false
为了能够从函数返回验证状态,您应该同步调用服务器端验证器。查看关于发出ajax请求的信息,您需要将async属性设置为false ajaxValidate函数不显式返回任何内容,因此它隐式返回未定义的内容,然后将其转换为布尔值false
为了能够从函数返回验证状态,您应该同步调用服务器端验证器。查看关于发出ajax请求的信息,您需要将async属性设置为false 我认为问题在于,您正在为数据键传递一个字符串值,而实际上它需要一个对象。例如- ajax{type:GET,url:/,data:?bob=bob&carol=carol,success:function{console.logarguments.length;} 实际上点击了URL- stackoverflow.com/?_979;=1295905818376&?bob=bob&carol=carol 鉴于- ajax{type:GET,url:/,data:{bob:bob,carol:carol},success:function{console.logarguments.length;} 点击网址- stackoverflow.com/?_979;=1295906023724&bob=bob&carol=carol 出现的额外参数是jQuery添加的时间戳,用于防止缓存响应 因此,我认为,如果您将代码更改为以下内容,它将为您提供预期的警报-
$.ajax({
type: "GET",
url: "ajaxValidate.php",
data: {email: fval1.val()), user:fval2.val()},
success: function(msg){
alert(fval1.val());
alert(msg);
}
});
然后可能值得注意的是,success回调函数中的代码将在将来的某个时间点运行,而不是在代码中的某个时间点按顺序运行。这意味着您可能需要将验证代码重新编写成某种形式-
"Create an account": function() {
var bValid = true;
allFields.removeClass( "ui-state-error" );
bValid = bValid && checkLength( name, "username", 3, 16 );
bValid = bValid && checkLength( email, "email", 6, 80 );
bValid = bValid && checkLength( password, "password", 5, 16 );
bValid = bValid && checkRegexp( name, /^[a-z]([0-9a-z_])+$/i, "Username may consist of a-z, 0-9, underscores, begin with a letter." );
// From jquery.validate.js (by joern), contributed by Scott Gonzalez: http://projects.scottsplayground.com/email_address_validation/
bValid = bValid && checkRegexp( email, /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i, "eg. john.doe@pokermaps.org" );
bValid = bValid && checkRegexp( password, /^([0-9a-zA-Z])+$/, "Password field only allow : a-z 0-9" );
var $this = $(this);
$.ajax({
type: "GET",
url: "ajaxValidate.php",
data: "?email="+escape(fval1.val())+"&user="+escape(fval2.val()),
success: function(msg){
$( "#users tbody" ).append( "<tr>" +
"<td>" + name.val() + "</td>" +
"<td>" + email.val() + "</td>" +
"<td>" + password.val() + "</td>" +
"</tr>" );
document.forms["regform"].submit();
$this.dialog( "close" );
},
});
},
我以前从未使用过对话框,所以我不确定插件希望函数返回什么,等等,但是您需要一个类似这样的结构来支持异步调用
希望有帮助
Chris我认为问题在于,您正在为数据键传递一个字符串值,而实际上它需要一个对象。例如- ajax{type:GET,url:/,data:?bob=bob&carol=carol,success:function{console.logarguments.length;} 实际上点击了URL- stackoverflow.com/?_979;=1295905818376&?bob=bob&carol=carol 鉴于- ajax{type:GET,url:/,data:{bob:bob,carol:carol},success:function{console.logarguments.length;} 点击网址- stackoverflow.com/?_979;=1295906023724&bob=bob&carol=carol 出现的额外参数是jQuery添加的时间戳,用于防止缓存响应 因此,我认为,如果您将代码更改为以下内容,它将为您提供预期的警报-
$.ajax({
type: "GET",
url: "ajaxValidate.php",
data: {email: fval1.val()), user:fval2.val()},
success: function(msg){
alert(fval1.val());
alert(msg);
}
});
然后可能值得注意的是,success回调函数中的代码将在将来的某个时间点运行,而不是在代码中的某个时间点按顺序运行。这意味着您可能需要将验证代码重新编写成某种形式-
"Create an account": function() {
var bValid = true;
allFields.removeClass( "ui-state-error" );
bValid = bValid && checkLength( name, "username", 3, 16 );
bValid = bValid && checkLength( email, "email", 6, 80 );
bValid = bValid && checkLength( password, "password", 5, 16 );
bValid = bValid && checkRegexp( name, /^[a-z]([0-9a-z_])+$/i, "Username may consist of a-z, 0-9, underscores, begin with a letter." );
// From jquery.validate.js (by joern), contributed by Scott Gonzalez: http://projects.scottsplayground.com/email_address_validation/
bValid = bValid && checkRegexp( email, /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i, "eg. john.doe@pokermaps.org" );
bValid = bValid && checkRegexp( password, /^([0-9a-zA-Z])+$/, "Password field only allow : a-z 0-9" );
var $this = $(this);
$.ajax({
type: "GET",
url: "ajaxValidate.php",
data: "?email="+escape(fval1.val())+"&user="+escape(fval2.val()),
success: function(msg){
$( "#users tbody" ).append( "<tr>" +
"<td>" + name.val() + "</td>" +
"<td>" + email.val() + "</td>" +
"<td>" + password.val() + "</td>" +
"</tr>" );
document.forms["regform"].submit();
$this.dialog( "close" );
},
});
},
我以前从未使用过对话框,所以我不确定插件希望函数返回什么,等等,但是您需要一个类似这样的结构来支持异步调用
希望有帮助
Chris即使使用async:false,也只验证其中一个。如果只添加async:false,则函数仍将返回未定义。如果返回结果的方式存在问题,那么checkRegexp函数为什么工作?checkRegexp函数会定期返回true或false。ajaxValidate函数不返回任何内容;它只有这个ajax调用,带有返回true或false的success函数。您应该将从success func返回的值指定给某个变量,并从AjaxValidateEvent返回该变量,即使使用async:false,也只验证其中一个变量。如果只添加async:false,您的函数仍将返回未定义的值,如果返回结果的方式有问题,那么checkRegexp函数为什么工作呢?checkRegexp函数经常返回true或false。ajaxValidate函数不返回任何内容;它只有这个ajax调用,带有返回true或false的success函数。您应该将从success func返回的值指定给某个变量,然后从ajaxValidateA返回该变量,并提供一些有用的信息。
.. 您能告诉我是否正在对服务器进行ajax调用,以及它们返回了什么吗?您是否尝试过按照下面的答案设置显式返回值?这看起来确实有一个合理的工作机会,但是你没有对结果发表评论,如果在ajaxValidate的末尾添加一个返回true将有效地否定Validation,但确定问题是它是否总是返回一个假值…我不确定如何设置“显式返回值”。我不确定是否调用被发送到php脚本,但是我可以告诉你,我已经测试了php脚本,它可以正常工作。从你最近的更新来看,php脚本在这种情况下似乎不能正常工作。我建议您也做一个提醒?email=+escapefval1.val+&user=+escapefval2.val检查url是否正确构造,如果正确,请直接复制到浏览器中,查看它是否仍然只返回部分查询。一下子我看不出有什么原因会出问题……看起来还不错。。我收到一封电子邮件=myemail@email.com&user=myuser。如果我像这样直接转到php脚本:ajaxValidate.php?电子邮件=myemail@email.com&user=myuser我得到了正确的回复,包括电子邮件地址定义了一些有用的信息。。。您能告诉我是否正在对服务器进行ajax调用,以及它们返回了什么吗?您是否尝试过按照下面的答案设置显式返回值?这看起来确实有一个合理的工作机会,但是你没有对结果发表评论,如果在ajaxValidate的末尾添加一个返回true将有效地否定Validation,但确定问题是它是否总是返回一个假值…我不确定如何设置“显式返回值”。我不确定是否调用被发送到php脚本,但是我可以告诉你,我已经测试了php脚本,它可以正常工作。从你最近的更新来看,php脚本在这种情况下似乎不能正常工作。我建议您也做一个提醒?email=+escapefval1.val+&user=+escapefval2.val检查url是否正确构造,如果正确,请直接复制到浏览器中,查看它是否仍然只返回部分查询。一下子我看不出有什么原因会出问题……看起来还不错。。我收到一封电子邮件=myemail@email.com&user=myuser。如果我像这样直接转到php脚本:ajaxValidate.php?电子邮件=myemail@email.com&user=myuser我得到了正确的响应,包括定义的电子邮件地址这一行中的某些内容无效,它使对话框窗口数据出错:{email:fval1.val,user:fval2.val},我的错在第一个fval1.val之后有一个额外的右括号,它应该是-{email:fval1.val,user:fval2.val}这一行中的某些内容无效,它使对话框窗口数据出错:{email:fval1.val,user:fval2.val},我的错,在第一个fval1.val之后有一个额外的紧括号,它应该是-{email:fval1.val,user:fval2.val}