我对Javascript和所有人都很陌生。我正在进行注册页面。我使用了朋友给出的模板，我正在尝试使用Laravel 5.3。
我在这里想要实现的是：验证电子邮件是否已经存在于数据库中。现在验证工作。它会告诉您电子邮件是否存在。但是一旦完成，无论用户如何更改电子邮件输入，它始终显示电子邮件已被删除。
var form = $(".form-signup");
$('#submit-form').click(function(e) {
form.validate({
rules: {
name: {
required: true,
minlength: 3
},
email: {
required: true,
email: true,
remote: {
url: "/check/",
type: "get"
}
},
password: {
required: true,
minlength: 6,
maxlength: 16
},
password2: {
required: true,
minlength: 6,
maxlength: 16,
equalTo: '#password'
},
terms: {
required: true
}
},
messages: {
name: {
required: 'Enter your first name',
minlength: 'Enter at least 3 characters or more'
},
email: {
required: 'Enter email address',
email: 'Enter a valid email address',
remote: 'Email has been taken'
},
password: {
required: 'Write your password',
minlength: 'Minimum 6 characters',
maxlength: 'Maximum 16 characters'
},
password2: {
required: 'Write your password',
minlength: 'Minimum 6 characters',
maxlength: 'Maximum 16 characters',
equalTo: '2 passwords must be the same'
},
terms: {
required: 'You must agree with terms'
}
},
errorPlacement: function(error, element) {
console.log(element);
if (element.is(":radio") || element.is(":checkbox")) {
element.closest('.option-group').after(error);
} else {
error.insertAfter(element);
}
}
});
e.preventDefault();
if (form.valid()) {
$(this).addClass('ladda-button');
var l = Ladda.create(this);
l.start();
setTimeout(function() {
//AJAX added.
var formData = {
_token:$(this).data('token'),
name: $('#name').val(),
email: $('#email').val(),
password: $('#password').val(),
password_confirmation: $('#password2').val()
};
$.ajax({
type: 'POST',
url: '/register',
beforeSend: function (xhr) {
var token = $('meta[name="csrf_token"]').attr('content');
if (token) {
return xhr.setRequestHeader('X-CSRF-TOKEN', token);
}
},
data: formData,
dataType: 'json',
statusCode: {
200: function (data) {
console.log('success');
console.log(data);
},
500: function (data) {
console.log(data);
}
}
});
}, 2000);
} else {
alert('not valid');
}
});
}
这是我的前端
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta content="" name="description" />
<meta content="themes-lab" name="author" />
<meta name="csrf_token" content="{{ csrf_token() }}" />
<link rel="shortcut icon" href="{{asset('admin_assets/images/favicon.png')}}">
<link href="{{asset('admin_assets/css/style.css')}}" rel="stylesheet">
<link href="{{asset('admin_assets/css/ui.css')}}" rel="stylesheet">
<link href="{{asset('admin_assets/plugins/icheck/skins/all.css')}}" rel="stylesheet"/>
<link href="{{asset('admin_assets/plugins/bootstrap-loading/lada.min.css')}}" rel="stylesheet">
</head>
<body class="account separate-inputs boxed" data-page="signup">
<!-- BEGIN LOGIN BOX -->
<div class="container" id="login-block">
<div class="row">
<div class="col-sm-6 col-md-6 col-md-offset-3">
<div class="account-wall">
<i class="user-img icons-faces-users-03"></i>
<form class="form-signup" role="form">
<div class="append-icon">
<input type="text" name="name" id="name" class="form-control form-white name" placeholder="Name" required autofocus>
<i class="icon-user"></i>
</div>
<div class="append-icon">
<input type="email" name="email" id="email" class="form-control form-white email" placeholder="Email" required>
<i class="icon-envelope"></i>
</div>
<div class="append-icon">
<input type="password" name="password" id="password" class="form-control form-white password" placeholder="Password" required>
<i class="icon-lock"></i>
</div>
<div class="append-icon m-b-20">
<input type="password" name="password2" id="password2" class="form-control form-white password2" placeholder="Repeat Password" required>
<i class="icon-lock"></i>
</div>
<div class="terms option-group">
<label for="terms" class="m-t-10">
<input type="checkbox" name="terms" id="terms" data-checkbox="icheckbox_square-blue" required/>
I agree with terms and conditions
</label>
</div>
<button type="submit" id="submit-form" class="btn btn-lg btn-dark m-t-20" data-style="expand-left">Register</button>
<div class="clearfix">
<p class="pull-right m-t-20"><a href="user-login-v1.html">Already have an account? Sign In</a></p>
</div>
</form>
</div>
</div>
</div>
</div>
<!-- END LOCKSCREEN BOX -->
<script src="{{asset('admin_assets/plugins/jquery/jquery-1.11.1.min.js')}}"></script>
<script src="{{asset('admin_assets/plugins/jquery/jquery-migrate-1.2.1.min.js')}}"></script>
<script src="{{asset('admin_assets/plugins/gsap/main-gsap.min.js')}}"></script>
<script src="{{asset('admin_assets/plugins/bootstrap/js/bootstrap.min.js')}}"></script>
<script src="{{asset('admin_assets/plugins/icheck/icheck.min.js')}}"></script>
<script src="{{asset('admin_assets/plugins/backstretch/backstretch.min.js')}}"></script>
<script src="{{asset('admin_assets/plugins/bootstrap-loading/lada.min.js')}}"></script>
<script src="{{asset('admin_assets/plugins/jquery-validation/jquery.validate.min.js')}}"></script>
<script src="{{asset('admin_assets/plugins/jquery-validation/additional-methods.min.js')}}"></script>
<script src="{{asset('admin_assets/js/plugins.js')}}"></script>
<script src="{{asset('admin_assets/js/pages/login-v1.js')}}"></script>
</body>
</html>
基本上，一旦用户输入用过的电子邮件并收到错误消息，他们就无法继续，按钮将继续旋转。
任何人都可以建议任何可能的解决方案吗？解决这个问题会很棒。谢谢！
答案 0 :(得分：0)
是的，经过大量的研究，我终于想通了自己。
原因是，jQuery验证不等待远程响应。这就是为什么程序即使已经收到电子邮件也会运行。
要解决此问题，只需添加
即可
{{1}}
在遥控器中。它会工作得很好！