JQuery远程validation（不阻止表单提交）
我面临以下问题。 在注册表单中，如果已经使用了给定的用户名，它会尝试远程检查。 这很好用，如果用户名已经使用，我添加错误类工作正常。 问题是，即使用户名已被使用，您仍然可以提交注册表单。 不应该远程validation阻止吗？
这是我的validation码。
var validator = $('#register').validate({ rules: { registerUsername: { required: true, remote: { type: 'post', url: 'includes/CheckUsername', data: { username: function() { return $('#registerUsername').val() } }, complete: function(data){ if( data.responseText != "found" ) { $('#regUsernameGroup').addClass('has-error').removeClass('has-success'); return false; } else{ $('#regUsernameGroup').removeClass('has-error').addClass('has-success'); } } } }, registerEmail: { required: true }, registerPassword: { required: true } }, messages: { registerUsername: {remote: 'tzuwertzut',required: 'asdasd'}, registerEmail: "", registerPassword: "" }, highlight: function(element) { $(element).closest('.form-group').addClass('has-error'); }, unhighlight: function(element) { $(element).closest('.form-group').removeClass('has-error').addClass('has-success'); } }); $('#myModal').on('hidden.bs.modal', function () { validator.resetForm(); $('#regEmailGroup').removeClass('has-error').removeClass('has-success'); $('#regUsernameGroup').removeClass('has-error').removeClass('has-success'); $('#regPassGroup').removeClass('has-error').removeClass('has-success'); }）;
任何提示将不胜感激。
参考remote方法的文档 ：
选项 ：
这些选项深度扩展了默认值 （dataType:"json", data:{nameOfTheElement:valueOfTheElement}）。 您提供的任何选项都将覆盖默认值。
和…
响应被评估为JSON， 对于有效元素必须为
true，并且对于无效元素，可以是任何false，undefined或null，使用默认消息; 或者一个字符串，例如。 “该名称已被采用，请尝试使用peter123”以显示为错误消息。
（ 上面的“响应”一词是指服务器端代码的响应 ）
现在让我们检查一下你的代码：
remote: { type: 'post', url: 'includes/CheckUsername', data: { username: function () { return $('#registerUsername').val() } }, complete: function (data) { if (data.responseText != "found") { $('#regUsernameGroup').addClass('has-error').removeClass('has-success'); return false; } else { $('#regUsernameGroup').removeClass('has-error').addClass('has-success'); } } }
关于您对data:的使用data:
data: { username: function () { return $('#registerUsername').val() } }
根据上面引用的文档， data选项的默认值已经是nameOfTheElement: valueOfTheElement ，所以在这里根本不需要覆盖它。 您的语法没有任何问题，但只有当您还必须从另一个字段发送数据以及来自remote目标字段的数据时，才需要此选项; 示例 – 您正在使用remote检查用户名字段，但您需要发送电子邮件地址字段。
关于您对complete:的使用complete:
complete: function (data) { if (data.responseText != "found") { $('#regUsernameGroup').addClass('has-error').removeClass('has-success'); return false; } else { $('#regUsernameGroup').removeClass('has-error').addClass('has-success'); } }
绝对没有必要指定.addClass('has-error').removeClass('has-success')和.removeClass('has-error').addClass('has-success') 。 当remote规则接收通过/失败状态时， 类的正确应用将自动发生 。
您的逻辑正在尝试确定响应是否与"found"匹配。 如果没有，则返回false 。 如果是（匹配"found" ），那么您希望它通过validation。 但是，根据文档，如果服务器返回一个字符串，则认为它具有“失败”validation，并且该字符串将成为错误消息。 我相信你的return false行只是完全禁用remote规则，这就是你能够提交表单的原因。
基本上，您无需手动检查响应是否与任何内容匹配。 同样，远程规则只是在validation通过时查找服务器端响应，如果validation失败，则返回false ， undefined ， null或字符串。 然后，插件会自动处理所有内容， 包括错误类 。
只要您的服务器端代码构造正确以返回所需的响应，您的remote规则只需要看起来像这样……
remote: { type: 'post', url: 'includes/CheckUsername' }