Foundation 6 Abide - 如何实现 formnovalidate答案

【问题标题】：Foundation 6 Abide - How to implement formnovalidateFoundation 6 Abide - 如何实现 formnovalidate
【发布时间】：2018-11-26 14:20:56
【问题描述】：

我有一个使用 Abide 的表单。该表单有两个按钮，都是 type="submit" 但一个设置了 formnovalidate 属性。此按钮用于“上一步”，因为它获取用户填写的任何内容并提交表单，将用户带到表单的上一步。

问题是，当用户单击取消阻止用户返回时，遵守验证仍然会启动，直到他填写了当前步骤的所有字段。 HTML5 验证具有完全针对此用例的 formnovalidate 属性。有没有办法在单击取消按钮时“忽略/跳过”遵守验证？

github上的问题链接：https://github.com/zurb/foundation-sites/issues/11426#issuecomment-441956255

【问题讨论】：

标签： html zurb-foundation abide

【解决方案1】：

已在 github 问题中解决。目前，Foundation 没有对此的本地支持。一种解决方法是在 Foundation JS 中重写提交处理程序。我是这样做的：

.on( "submit.zf.abide", function( e ){
    var $btn = $(document.activeElement);
    if (
            /* there is an activeElement at all */
            $btn.length &&

            /* it's a child of the form */
            t.$element.has($btn) &&

            /* it's really a submit element */
            $btn.is('[type="submit"]') &&

            /* it has a "formnovalidate" attribute */
            $btn.is('[formnovalidate]')
    ) {
        return true;
    }else{
        return t.validateForm()
    }
})

【讨论】：