如果布尔字段为true,我想显示一个包含其他字段的div(仅当为true时才需要),如果bool为false,则隐藏div。目前,此代码可显示和隐藏div:
$('.hidden-div').hide();
$('#id_bool').change(function() {
$('.hidden-div').toggle(this.true);
});
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<form method="post" novalidate>
<div class='visible-div'>
<input id="id_bool" type="checkbox"/>
</div>
# Hidden fields upon initial rendering of form,
# but appear if bool is selected true.
# If bool is true, these fields are required.
<div class='hidden-div'>
<input id="id_required" type="text" required/>
</div>
<div class='visible-div'>
<input type="submit" value="Submit"/>
</div>
</form>
bool的默认值为false,因此当第一次呈现表单时,div被隐藏。当您检查布尔值true并尝试提交表单而不填写其他字段时,就会出现问题。
然后,该表单隐藏了div,即使需要隐藏字段,也仅显示正常显示字段的错误。它还保留了布尔值的真实值,但是hidden-div是隐藏的。然后,如果您检查bool为false,则将再次显示hidden-div,因此角色将反转,这不是我想要的。
有关如何解决此问题的任何提示?