我正在尝试构建一个窗体,该窗体在顶部1
和2
中具有两个值的单选按钮。如果选中具有1
值的单选按钮,我希望隐藏一个id
= facebook
的输入框。加载时,没有选中任何单选按钮。这是我的代码:
$("input[name='accountType']").change(function(){
var radio;
radio = $("input[name='accountType']").val();
if(radio === '1'){
("#facebook").hide();
}
});
这是我的HTML
<input type="text" name="facebook" id="facebook" value="" class="form-control">
<input type="radio" name="accountType" id="accountType-1" value="1" class="icheck" >
<input type="radio" name="accountType" id="accountType-2" value="2" class="icheck" >
我敢肯定它很明显,但是我刚刚开始使用jQuery,在这里我尝试了不同的答案,但是它们不起作用。
我究竟做错了什么?
最佳答案
更简单:
$('input[name=accountType]').change(function(){
$('#facebook').toggle(this.value !== '1');
});
Demo。首先,在选中的单选按钮上触发了
change
事件,因此无需再次使用完全选择器查找它-this
将引用相应的元素,而this.value
将为其提供值。其次,有一个方便的
.toggle
jQuery方法,可用于根据某些条件显示或隐藏元素(显示是否为真,显示为假,则隐藏)。在这种情况下,如果this.value
等于“ 1”,则需要隐藏该元素,这就是为什么我取消检查(使用!==
)的原因。附带说明,我删除了'accountType'周围的引号-如果属性值(在属性选择器中)是有效的JS标识符,则不需要使用引号。
关于javascript - 如果选中一个单选按钮,则隐藏,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/22999008/