Foundation 6 Abide-如何实施formnovalidate

时间:2018-11-26 14:20:57

标签: html5 zurb-foundation abide

我有一个使用Abide的表格。表单有两个按钮,两个按钮都是type =“ submit”,但是一个按钮设置了formnovalidate属性。此按钮用于“上一步”,因为它接受用户填写的所有内容并提交表单,将用户带到表单的上一步。

问题在于,当用户单击“取消”以阻止用户返回时,仍然需要遵守验证,直到他填写了当前步骤的所有字段。 HTML5验证具有恰好适合此用例的formnovalidate属性。单击取消按钮时,是否可以“忽略/跳过”遵守确认?

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

1 个答案:

答案 0 :(得分:0)

在github问题中解决。目前,基金会对此没有本地支持。一种解决方法是在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()
    }
})