Question

我有一个页面，当点击一个链接时，它会向下滑动一个联系表格（即它是一个以.slideDown（'slow'）显示的页面上的div

我有jQuery验证插件在联系表单上工作，只是我注意到在我测试时我有event.preventDefault（）;评论说。在最终版本中，我希望取消注释，因为我不希望页面重定向，甚至在点击提交时发布。

我有提交按钮发送Ajax帖子以发送电子邮件。我如何保留此功能并仍然使用jQuery的验证插件？

Answer 1

而不是在表单$.bind()上设置一个操作，并向表单提交按钮设置click处理程序，并使用$.post()发出帖子请求。但是请注意几句。首先，您应该在表单上设置操作，并默认情况下为已禁用Javascript的人重定向，然后使用jQuery从表单中删除操作，并将$.bind() click处理程序删除到页面加载时提交按钮。其次，在我的代码中，当我说使用提醒或其他可访问的通知时，我的意思是使用alert()方法，或者如果您使用dom元素来包含通知，请确保使用WAI-ARIA实时区域和角色属性，以使辅助设备可以访问通知。

 function onFormSubmit(event)
 {
      $.post('http://url.to.your.service', 
             $('#theFormId').serialize(), 
             function(data, textStatus)
             {
                   switch(textStatus)
                   {
                        // Alert or some other 
                        // accessible notification of success/failure
                   }
             }
      );
 }

编辑：我有时需要更仔细地阅读问题。因此，您已经使用提交按钮发送AJAX请求。也许我的可用性评论对你有用，所以我会留下这部分答案。如果您将操作设置为javascript:null(0)，#，或将目标设置为隐藏的iframe，那么该操作也可以正常工作。

Answer 2

尝试以下逻辑：

var form = $("#your-form-id");
form.validate(); //jquery validation
form.on("submit", function (e) {
if(!form.valid()) {
    return false; //Check first if the form is valid, otherwise return false which will redirect to validation
}
    e.preventDefault();//If the form is valid, prevent default submission
    // Now proceed to submit your form via ajax below
    // ...
});

jQuery使用event.preventDefault（）验证插件

2 个答案: