Question

所以我有一个我正在研究的多部分表单，我想检查每个步骤的值，并在该步骤的输入字段上运行一些基本验证。我在我的示例中的代码大部分都有用，但我似乎无法弄清楚如果验证失败，如何阻止表单移动到下一步。任何人都知道如何做到这一点？

Answer 1

要阻止按钮上的表单提交，如果它无效，则需要将false返回到click事件。这是my JSFiddle

    $("#btnPage2").click(function() {
        var isValid = true;//added local variable to track validation
        $("#group1 input[type=text]").each(function() {
            if((this.value) == "") {
                isValid = false;//form was not valid
                return false;
            }
        });  
        if (! isValid) {//when form is not valid, return false
            return false;
        }
    });

根据要求，当我想将事件绑定到所有btnPage按钮时，我就是这样做的。它检索按钮所在的组编号（在这种情况下，btnPage减1的末尾的编号是组编号）并在每个语句中使用它进行验证。 Fiddle Here

$('a[id^="btnPage"]').click(function() {
    var groupNum = +($(this).attr('id').replace('btnPage', '')) - 1;//get the group number to validate
    var isValid = true;//added local variable to track validation
    $('#group' + groupNum + ' input[type=text]').each(function() {
        if(this.value == "") {
            isValid = false;//form was not valid
            return false;
        }
    });  
    if (! isValid) {//when form is not valid, return false
        return false;
    }
});

如何禁用多部分表单上的下一个按钮？

1 个答案: