如何使用复选框隐藏/显示或切换两个div-form字段？

我目前正在一个窗体上工作，我想用复选框来显示/隐藏div窗体域。在我的研究中，我碰到了;使用此单选按钮如何使用复选框隐藏/显示或切换两个div-form字段？

显示/隐藏输入表单字段： https://codepen.io/chriscoyier/pen/LEGXOK

请我想申请复选框，而不是无线电插嘴显示/隐藏DIV-表单域，而不是输入。

例子：我想从申请当申请人可以使用复选框

上传表单脚本上传自己的简历/恢复创建：

<div class="element-file" title="Click here to Upload Resume"><label class="title"></label><div class="item-cont"><label class="large"><div class="button">UPLOAD</div><div class="file_text">NO UPLOAD DETECTED</div><span class="icon-place"></span></label></div></div>

手动输入：

<div class="element-input" title="Enter your Full Name as indicated here."><label class="title"><span class="required">Required</span></label><div class="item-cont"><span class="icon-place"></span></div></div>

我想使用复选框在这两个Div表单字段之间切换使用此示例中的行为： https://codepen.io/chriscoyier/pen/LEGXOK

在此先感谢您的支持。

来源

2017-09-22 cHl Security

它应该是相同的。转到codepen，并将输入类型从“收音机”更改为“复选框”，您会看到它的工作原理。但是，既然您正在查看某种情况，似乎收音机比复选框更合适。 –

[使复选框行为像单选按钮]可能重复（https://stackoverflow.com/questions/23523987/making-checkboxes-behave-like-radio-buttons） – DCR

这将工作，但不喜欢单选按钮。有关如何操作，请参阅https://stackoverflow.com/questions/23523987/making-checkboxes-behave-like-radio-buttons。 – DCR

只需将此代码添加到bindUIActions方法即可。它会切换复选框。

bindUIActions: function() { 
    $("input[type='radio'], input[type='checkbox']").on("change", this.applyConditionalRequired, function() { 
     if (this.id == 'choice-animals-dogs') { 
     var checked = ($('#choice-animals-cats').checked) ? true : false; 
     $('#choice-animals-cats').prop('checked', checked); 
     } 
     if (this.id == 'choice-animals-cats') { 
     var checked = ($('#choice-animals-dogs').checked) ? true : false; 
     $('#choice-animals-dogs').prop('checked', checked); 
     } 
    }); 
    },

来源

2017-09-22 21:07:46

如何使用复选框隐藏/显示或切换两个div-form字段？

回答

相关问题