无法从jquery中的函数返回ajax responseText
Can not return ajax responseText from a function in jquery
我有一个表单供用户注册新帐户。我使用jquery+ajax来检查blur上电子邮件地址的可用性。在Jquery代码中,我使用了e.preventDefault();以防止在出现任何错误时提交表格。我在电子邮件输入中尝试了现有的电子邮件地址,然后点击提交表格。它允许提交表格。它不应该这样做,因为ajax reponseText返回false。请有人告诉我该如何修复此代码才能正常工作?我也读过类似的文章,我试过了,但还是不起作用。请帮我指出我需要什么来修复我当前的代码?
这是我的表格:
<form role="form" method="post" id="signupForm" action="index.php?view=signup-gv">
<div class="col-xs-6 border-right">
<div class="form-group">
<label for="exampleInputEmail1">Full Name</label>
<input type="text" class="form-control" id="regname" name="regname" placeholder="Full Name">
</div>
<div class="form-group">
<label for="exampleInputEmail1">Email Address</label><span id="emailcheck"></span>
<input type="email" class="form-control" id="regemail" name="regemail" placeholder="Enter email">
</div>
</div>
<div class="form-group col-xs-6">
<label for="exampleInputPassword1">Password</label>
<input type="password" class="form-control" id="regpass" name="regpass" placeholder="Password">
</div>
<button style="position:relative; left: 15px; top: 10px;" class="btn btn-default" name="register" id="register">Register</button>
</form>
这里是我的jquery代码:
$(document).ready(function(){
$('#regname').focus();
$('#regemail').blur(emailCheck);
$('#signupForm').submit(function(e) {
var regname = $('#regname');
var regemail = $('#regemail');
var regpass = $('#regpass');
var register_result = $('#register_result');
register_result.html('Loading..');
if(regname.val() == ''){
regname.focus();
register_result.html('<span class="errorss"> * Full name can not be blank</span>');
e.preventDefault();
}
else if ($.trim(regemail.val()).length == 0) {
regemail.focus();
register_result.html('<span class="errorss">* Email address can not be blank</span>');
e.preventDefault();
}
else if (emailCheck()==false) {
regemail.focus();
register_result.html('<span class="errorss"> This email address is already existed. Please choose another one </span>');
e.preventDefault();
}
else if(regpass.val() == ''){
regpass.focus();
register_result.html('<span class="errorss">* Password can not be blank</span>');
e.preventDefault();
}
});
});
function emailCheck() {
var regemail = $('#regemail');
var emailcheck = $('#emailcheck');
emailcheck.html('');
var UrlToPass = {regemail:regemail.val()} ;
$.ajax({
type : 'POST',
cache: false,
data : UrlToPass,
url : 'emailcheck.php',
success: function(responseText){
if(responseText == 0){
return true;
}
else{
emailcheck.html('<span class="errorss"> This email is existed.</span>');
return false;
}
}
});
}
所以,问题是:您试图从异步函数返回。当您尝试在success
回调函数中返回"true"或"false"时,函数emailCheck
已经结束,但没有返回任何内容。
因此,当您声明一个函数submit
时,您应该意识到,只有在返回ajax调用后,才能进一步进行提交。我建议您始终从submit
返回false,然后,只有在回调中才能决定是否提交代码。所以在这里,你可以这样做:
$('#signupForm').submit(function(e) {
var regname = $('#regname');
var regemail = $('#regemail');
var regpass = $('#regpass');
var register_result = $('#register_result');
register_result.html('Loading..');
if(regname.val() == ''){
regname.focus();
register_result.html('<span class="errorss"> * Full name can not be blank</span>');
return false;
} else if ($.trim(regemail.val()).length == 0) {
regemail.focus();
register_result.html('<span class="errorss">* Email address can not be blank</span>');
return false;
} else if(regpass.val() == ''){
regpass.focus();
register_result.html('<span class="errorss">* Password can not be blank</span>');
return false;
}
emailCheck().done(function(r){
if(r){
$('#regemail').focus();
$('#register_result').html('<span class="errorss"> This email address is already existed. Please choose another one </span>');
//Reseting to submit bind to not call function again
$('#signupForm').submit(function(){});
$('#signupForm').submit();
}
}).fail(function(r){
// Do something if fail.
});
return false
});
这只是针对您的问题的解决方法。对于更优雅的解决方案,您应该再次查看您提到的链接:如何从异步调用返回响应?。特别是在答案中,改进坏代码部分
您应该进行的另一个修复,您应该使用回调函数中的相同选择器再次选择"span"。所以,这样做:
$('#emailcheck').html('<span class="errorss"> This email is existed.</span>');
而不是这个:
emailcheck.html('<span class="errorss"> This email is existed.</span>');
相关文章:
- ES6构造函数返回基类的实例
- 从函数返回角度承诺
- 如何从jquery函数返回变量
- 根据是否解析了 Promise 从函数返回值
- Javascript函数返回未定义
- 如果函数返回True,则显示Javascript按钮
- Google Sheet自定义函数返回0
- 从Ajax函数返回值
- 使用for循环从Javascript中的函数返回多个值
- 谷歌地图:函数返回未定义的值在console.log中运行良好
- 从函数中的函数返回数组时出错
- 如何从嵌套的API函数返回值
- 从Mongoose结果匿名函数返回父函数
- 函数返回错误'令牌{'
- Jquery函数返回订单问题
- Mocha/Chai测试链接到函数返回断言错误
- 从异步函数返回值
- 函数返回后更新变量
- 我如何才能继续'如果'语句来比较作为参数的多个函数返回值
- 将外部函数返回的id传递给内部函数