表单隐藏字段和必需的验证使用

Question

我有一个带有隐藏字段的 HTML5/Bootstrap 表单： style="display: none"

我通过 jQuery 显示/隐藏：

show() | hide()

对于字段验证，我使用required属性。

我想按要求设置所有隐藏字段，但是当其中一些字段没有出现时，表单将无法继续提交。

关于如何仅对用户选择显示的字段启用验证的任何想法？

Answer 1

你可以使用这个技巧：

在 HTML 表单中：

<input type="text" name="username" required="required" class="input-hidden">

CSS类：

.input-hidden{
        height:0;
        width:0;
        visibility: hidden;
        padding:0;
        margin:0;
        float:right;
}

Answer 2

将一个类添加.hideable到可隐藏的所需输入中。然后使用这些函数代替 show() 和 hide()：

function show1() {
//Your show() code here
$('.hideable').attr('required', 'required');
}
function hide1() {
//Your hide() code here
$('.hideable').removeAttr('required');
}