Question

我有一份拆分的登记表。我正在寻找一种方法，最好使用css3，这将允许我隐藏表单字段，直到特定字段有效完成。

例如：我要求“团体名称”。当“组名”字段填充有效的组名时，表示存在于数据库或xml文件中的一个（此部分需要js，而下拉列表不是选项），则会出现第二个字段：“组密码”。 / p>

我正在使用html5和css3。如果绝对必要，我愿意使用javascript。感谢。

我想我可以使用这样的东西：

document.getElementById("groupname").disabled = true

但我不确定如何触发它。也许使用html5验证可以作为触发器？

Answer 1

乍一看似乎以下情况似乎有效：

:invalid ~ .test {
    display: none;
}

<form>
    <input type="text" required/> <!-- Displayed -->
    <fieldset class="test">
        <input type="text"/>  <!-- Hidden until top input is filled -->
    </fieldset>        
</form>

应该能够处理简单的案件。然后，可以使用setCustomValidity调用验证来增强此功能。

隐藏表单字段，直到填写早期字段？

1 个答案: