我的字段有问题, 码 HTML
<span id="sudaner">
<input type="radio" name="traveledis" checked value="0" >No
<input type="radio" name="traveledis" value="1" />Yes
</span>
<div id="sudandetails">`
这是js代码
$("#sudaner input[type='radio']").click(function(){
if($(this).attr("value")=="1"){
$("#sudandetails").css("display","block");
$("#countries").prop('required',true);
$("#bcfrom").prop('required',true);
$("#bcto").prop('required',true);
$("#country_reason").prop('required',true);
}
else {
$("#countries").prop('required',false);
$("#countries").val("");
$("#bcfrom").prop('required',false);
$("#bcfrom").val("");
$("#bcto").prop('required',false);
$("#bcto").val("");
$("#country_reason").prop('required',false);
$("#country_reason").val("");
$("#sudandetails").css("display","none");
}
});
我已经'检查'在'NO'中处于活动状态但是当我转到表单时,我看到默认情况下'否'但是这些字段最初并未隐藏。我需要通过'是'再次移动选择'否'并隐藏字段或在“否”中单击2次并隐藏字段。所以我不明白为什么这个领域最初没有隐藏。
感谢您的帮助
答案 0 :(得分:0)
你最初需要隐藏这个div。在你的脚本中添加这一行
$("#sudandetails").hide();
您可以在点击时绑定事件,并在页面加载点击事件时触发。
答案 1 :(得分:0)
我为你做了一个小提琴,并将ready
函数与click
函数组合在一个自己的处理程序中。您不仅可以检查值on click
,因为如果文档被加载则没有单击,所以没有任何反应。
https://jsfiddle.net/ww582Lj9/
function myHandler(e) {
if($(this).attr("value")=="1"){
$("#sudandetails").css("display","block");
$("#countries").prop('required',true);
$("#bcfrom").prop('required',true);
$("#bcto").prop('required',true);
$("#country_reason").prop('required',true);
}
else {
$("#countries").prop('required',false);
$("#countries").val("");
$("#bcfrom").prop('required',false);
$("#bcfrom").val("");
$("#bcto").prop('required',false);
$("#bcto").val("");
$("#country_reason").prop('required',false);
$("#country_reason").val("");
$("#sudandetails").css("display","none");
}
}
$(document).ready(myHandler);
$("#sudaner input[type='radio']").on("click", myHandler);