关键词：
【中文标题】在提交时检查 jQuery 验证之前的表单提交【英文标题】：Form submitting before jQuery validation is checked on submit 【发布时间】：2012-07-08 22:33:43 【问题描述】：我正在使用 Ajax 和 jQuery 来验证和提交表单中的信息。我遇到的问题是，当我单击提交按钮时，表单会在执行验证检查并显示错误之前立即将信息提交到服务器？
我不确定这里有什么问题，所以任何输入都会很棒！
干杯
$('#submit_second').click(function()
//remove classes
$('#second_step input').removeClass('error').removeClass('valid');
var emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]2,4$/;
var phonePattern = /^\+?[0-9]0,15$/ ;
var fields = $('#second_step input[type=text]');
var error = 0;
fields.each(function()
var value = $(this).val();
if( value.length<1 || value==field_values[$(this).attr('id')] || ( $(this).attr('id')=='email' && !emailPattern.test(value)))
$(this).addClass('error');
$(this).effect("shake", times:3 , 50);
error++;
else
$(this).addClass('valid');
if( value.length<1 || value==field_values[$(this).attr('id')] || ( $(this).attr('id')=='phone' && !phonePattern.test(value) ) )
$(this).addClass('error');
$(this).effect("shake", times:3 , 50);
error++;
else
$(this).addClass('valid');
);
if(!error)
//update progress bar
$('#progress_text').html('66% Complete');
$('#progress').css('width','226px');
//slide steps
$('#second_step').slideUp();
$('#fourth_step').slideDown();
else return false;
);
$('#submit_second').click(function()
url =$("input#url").val();
yourname =$("input#yourname").val();
email =$("input#email").val();
phone =$("input#phone").val();
//send information to server
var dataString = 'url='+ url + '&yourname=' + yourname + '&email=' + email + '&phone=' + phone;
alert (dataString);
$.ajax(
type: "POST",
url: "#",
data: "url="+url+"&yourname="+yourname+"&email="+email+'&phone=' + phone,
cache: false,
success: function(data)
console.log("form submitted");
alert("success");
);
return false;
);
【问题讨论】：
【参考方案1】：$('form_to_validate').submit(function()
// .. stuff
);
【讨论】：
我试过了，但是在提交每个部分后，表单有多个部分使用 jquery 动态加载，因此它不能正常工作，因为有 2 个部分每个都有一个提交按钮，第一部分工作正常，但作为我试图在第二阶段同时验证数据并将数据提交到服务器，它似乎在以我的代码结构方式执行验证检查之前提交数据？ 在您的问题中向我们展示 HTML。【参考方案2】：我猜你正在寻找的是这样的：
$('#submit_second').submit(function(evt)
evt.preventDefault();
...
);
查看 jQuery 文档：http://api.jquery.com/event.preventDefault/
【讨论】：
觉得这行不通吗？我不想阻止表单提交，只是在首先检查验证之后发生！如果我要将所有代码移动到一个函数中，您认为这将有助于解决问题吗？ 是的。您可以调用 preventDefault 以防验证失败，否则表单将正确提交。 我终于解决了问题，加油！ ***.com/questions/11413111/…表单：在表单提交之前使用 jQuery 验证特殊情况
】表单：在表单提交之前使用jQuery验证特殊情况【英文标题】：Form:ValidatespecialcaseswithjQuerybeforeformsubmission【发布时间】：2021-03-0816:42:48【问题描述】：我需要在不使用任何特殊插件的情况下验证表单，只需使用jQuery。我有一个... 查看详情
提交常规表单之前的 AJAX 请求
】提交常规表单之前的AJAX请求【英文标题】：AJAXrequestbeforeregularformisbeingsubmitted【发布时间】：2013-07-2623:43:27【问题描述】：我有一个在用户尝试提交时执行的jQuery表单验证脚本。我希望在验证表单之后但在发送之前执行（并完... 查看详情
如何在提交表单时验证 Google reCaptcha
】如何在提交表单时验证GooglereCaptcha【英文标题】：HowtoValidateGooglereCaptchaonFormSubmit【发布时间】：2015-02-1113:44:34【问题描述】：最近，Google彻底改造了他们的reCaptchaAPI，并将其简化为一个复选框。问题是，我可以在不检查的情... 查看详情
表单提交之前的jQuery函数
】表单提交之前的jQuery函数【英文标题】：jQueryfunctionBEFOREformsubmission【发布时间】：2014-03-2305:23:47【问题描述】：我试图在单击表单提交按钮时使用Jquery触发一个函数，但该函数需要在表单实际提交之前触发。我正在尝试在提... 查看详情
在提交第二个表单时，正在验证第一个表单 - jquery validate
】在提交第二个表单时，正在验证第一个表单-jqueryvalidate【英文标题】：Onsubmissionof2ndform,firstformisbeingvalidated-jqueryvalidate【发布时间】：2015-08-2407:11:10【问题描述】：在提交第二个表单时，正在验证第一个表单，两个表单都是独... 查看详情
Ajax提交之前的jQuery表单验证
】Ajax提交之前的jQuery表单验证【英文标题】：jQueryFormValidationbeforeAjaxsubmit【发布时间】：2012-07-1306:04:09【问题描述】：JavaScript位：$(document).ready(function()$(\'#form\').submit(function(e)e.preventDefault();var$form=$(this);//checkiftheinputi 查看详情
jQuery Validate：在提交之前验证后删除元素？
】jQueryValidate：在提交之前验证后删除元素？【英文标题】：jQueryValidate:RemoveelementAFTERvalidationBEFOREsubmit?【发布时间】：2018-08-2020:06:39【问题描述】：我有一个城市的SVG地图，点击它时，会在我的表单中的div中创建隐藏元素。我... 查看详情
jquery，在提交之前设置单选字段的按钮
】jquery，在提交之前设置单选字段的按钮【英文标题】：jquery,buttonthatsetsaradiofieldbeforesubmitting【发布时间】：2017-05-0722:09:03【问题描述】：我试图在提交表单之前设置一个提交按钮来设置一个单选输入字段。它正确设置了单选btn... 查看详情
jQuery 在提交表单之前等待 Ajax
】jQuery在提交表单之前等待Ajax【英文标题】：jQueryWaitforAjaxBeforeSubmittingForm【发布时间】：2017-09-0516:04:17【问题描述】：我想在提交表单之前完成三个Ajax功能，但它们也会在提交时触发。在发送表单之前强制jQuery等待所有Ajax函... 查看详情
数据验证后提交表单
】数据验证后提交表单【英文标题】：Submitformafterdatavalidation【发布时间】：2018-11-0801:21:30【问题描述】：我使用React和Redux创建了带有验证的表单。验证条件：数据应在输入时进行验证提交前需再次验证数据所有数据所有字段均... 查看详情
使用 .on 和 .validate 的 jQuery 必须提交两次表单才能验证
】使用.on和.validate的jQuery必须提交两次表单才能验证【英文标题】：jQueryusing.onand.validatemustsubmitformtwicetovalidate【发布时间】：2013-03-1807:02:19【问题描述】：我正在通过ajax加载表单并使用新的.on()加载jQuery验证插件在我第二次按... 查看详情
在提交php之前验证表单
】在提交php之前验证表单【英文标题】：validateformbeforesubmitphp【发布时间】：2016-12-3002:23:15【问题描述】：我有一个问题要问。我有一个用户必须填写的表格。有几个字段有限制（例如名称不能为空）。问题是每次我按下提交按... 查看详情
JQuery-Validate Plugin：添加规则以输入“文件”时，我的表单被提交
...ery-ValidatePlugin：添加规则以输入“文件”时，我的表单被提交【英文标题】：JQuery-ValidatePlugin:Myformgetssubmittedwhenaddingrulestoinput"file"【发布时间】：2018-01-3012:58:13【问题描述】：我是前端验证的新手，所以我希望在这里能... 查看详情
jQuery 表单验证检查以循环结束
...的客户端验证。（目前只检查X字段是否为空）但是当我提交表单时，我最终陷入了一个永远的循环。我可以解释问题，并且我理解“为什么”。但我不知道如何解决它。出现问题的原因是：每次我提交表单 查看详情
当 jquery.validate 验证表单时启用提交按钮
】当jquery.validate验证表单时启用提交按钮【英文标题】：enablesubmitbuttonwhenjquery.validatehasvaliatedtheform【发布时间】：2018-02-1912:23:45【问题描述】：我有一个正在使用jquery.validate验证的表单。我已经添加了reCAPTCHA2.0，这也正在验证... 查看详情
bassistance jquery验证插件有问题，表单无效时提交
】bassistancejquery验证插件有问题，表单无效时提交【英文标题】：Problemwithbassistancejqueryvalidationplugin,formsubmitswheninvalid【发布时间】：2011-06-0704:26:55【问题描述】：我似乎找不到任何与我在尝试使用bassistancejquery验证插件时的行为... 查看详情
jQuery表单验证
...“是”选项，则显示第二个表。我需要添加验证以确保在提交表单之前选择所有可见项目。我遇到的问题是，如果第二个表被隐藏（因为为项目8和9选择了“否”），表单应该提交来自第一个表的数据，因为第二个表没有显 查看详情
要求用户在提交表单之前点击谷歌的新验证码
】要求用户在提交表单之前点击谷歌的新验证码【英文标题】：RequireUsertoclickgoogle\'snewrecaptchabeforeformsubmission【发布时间】：2015-09-1002:33:59【问题描述】：我在表单(HTML5)中使用了谷歌的新验证码：https://www.google.com/recaptcha在提交... 查看详情