单击复选框后，然后需要表单字段吗？
[英]Once Checkbox is clicked on, form fields then become required?
问题描述
I am using a checkbox and it shows/hides fields upon clicking the checkbox. 
我正在使用一个复选框，单击该复选框会显示/隐藏字段。 I would like to make my fields required to input information only when I click on the checkbox and the fields are showing. 我想让我的字段仅在单击复选框并且显示字段时才需要输入信息。 When the fields are hidden, and the checkbox is not clicked on, then those fields are not required to input information. 当字段被隐藏并且未单击复选框时，则不需要这些字段来输入信息。 How do I make this happen. 我如何做到这一点。 This is the code that I am using; 这是我正在使用的代码；
<script type="text/javascript" language="JavaScript">
function HidePart(d) {
document.getElementById(d).style.display = "none";
}
function ShowPart(d) {
document.getElementById(d).style.display = "block";
}
function CheckboxChecked(b,d)
{
if(b) {
ShowPart(d);
}
else {
HidePart(d);
}
}
</script>
<input type="checkbox" name="Loan2" value="yes" onclick="CheckboxChecked(this.checked,'checkboxdiv2')"> Add New Loan
<div id="checkboxdiv2" style="display:none">
Form Fields for input information
</div>
If this helps, this is my website: https://www.slfpusa.org/testing-page/ . 如果有帮助，请访问我的网站： https : //www.slfpusa.org/testing-page/ 。 When I click on "Add New Loan", it produces more fields that I would like to only be required once they are showing. 当我单击“添加新贷款”时，它将产生更多的字段，这些字段仅在显示时才需要。 I hope my question is clear, and I hope to get some help in tweaking this javascript code to function to the way I need it to function. 我希望我的问题很清楚，并且希望在调整此javascript代码使其达到我需要的功能时获得一些帮助。 Any help would be much appreciated! 任何帮助将非常感激！
2 个解决方案
解决方案1
0 2014-12-28 03:56:06
Put your form validation code into an extra if statement. 将表单验证代码放入额外的if语句中。 Try something like this: 尝试这样的事情：
if (document.loan2.checked) {
// validate the input
} else {
return false;
}
解决方案2
0 2014-12-28 05:57:10
I tried to make this as clear as possible for you. 我试图让您对此尽可能清楚。 Just read the comments and all should be well. 只要阅读评论，一切都应该很好。
<html>
<head>
<!--Add this JQuery library to make this a whole lot easier for you-->
<!--This library provides a more effecient way of writing javascript-->
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
</head>
<body>
<form>
<input id ="checkboxId" type ="checkbox">Add new Loan</input><br>
<label style="display:none">Enter value:</label>
<input id="textboxId" style="display:none" type ="text"/>
<button style="display:none" type ="submit">Click Me</button>
</form>
<script>
//In between your script tags add the following JQuery code
//This will check if the check box is clicked
$('#checkboxId').click(function () {
//if checkbox is clicked then make the textbox required
if ($('#checkboxId').prop('checked'))
{
$("#textboxId").prop('required',true);
$("#textboxId").slideDown();
$("label").slideDown();
$("button").slideDown();
} else {
//else do not make the textbox required
$("#textboxId").prop('required',false);
$("#textboxId").slideUp();
$("label").slideUp();
$("button").slideUp();
}
});
</script>
</body>
</html>
If you have any questions let me know. 如果您有任何问题，请通知我。 Hope this helps 希望这可以帮助
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.