是否显示每个选定下拉列表的输入标签并进行验证

Question

这是我的下拉和输入字段的代码

<div>
<select id="scl">
<option value="10">Ten</option>
<option value="7">Seven</option>
<option value="4">Four</option>
</select>
</div>
<form>
<div class="10 box" ><input type="number"  required></div>
<div class="7 box" hidden><input type="numbe" required></div>
<div class="4 box" hidden><input type="number" required></div>
<input type="submit" >
</form>

这是我的jquery代码

<script>
$(document).ready(function(){
$("#scl").change(function(){
$(this).find("option:selected").each(function(){
var optionValue = $(this).attr("value");
if(optionValue){
$(".box").not("." + optionValue).hide();
$("." + optionValue).show();
} else{
$(".box").hide();
}
});
}).change();
});
</script>

它不提交我的表格。

它显示并隐藏特定下拉列表的输入字段(即，如果选择选项10，则显示输入字段10(，但我的问题是如何从剩余的两个字段中删除验证，以便提交表单

我只需要对所选字段进行验证

如有任何帮助，我们将不胜感激。

Answer 1

也许不添加"必需"；在这里-

您可以添加"；"必需"；到该$("."+optionValue(.show((之后的输入字段；

使用此行可将所需道具添加到此字段：$("."+optionValue(.prop('required'，true(；

随后将其他设置为false。