[英]Disable <select> when checkbox enabled
I want to use javascript to set the attribute disabled="disabled" to the with id age 2 when the checkbox with id "exactage" is enabled. 当启用ID为“ exactage”的复选框时,我想使用Javascript将属性disable =“ disabled”设置为ID年龄为2。 Any ideas? 有任何想法吗? Thanks in advance. 提前致谢。 A happy coder :) 一个快乐的编码器:)
<select id="age">
<option value="18"><18</option>
</select>
<select id="age2">
<option value="18"><18</option>
</select>
<input type="checkbox" id="exactage"/> Require exact age
Note that I had a momentary blind-spot when I wrote this answer: I could've sworn that I saw a jquery tag. 请注意,当我编写此答案时,我有一个短暂的盲点:我可能发誓我看到了一个jquery标签。 Sigh. 叹。 My mistake, it's not worth revising this answer, now, since other functional plain JS answers are posted, that I can't improve upon. 我的错误是,现在不值得修改此答案,因为发布了其他功能纯JS答案,所以我无法改进。
I will, however, change this to community wiki, and leave it for the moment as further information. 但是,我将其更改为社区Wiki,暂时将其保留为进一步的信息。
The following should work for you, if you're using jQuery (see my above addenda, regarding blind-spots): 如果您使用的是jQuery, 则以下内容应该为您工作(有关盲区,请参阅我上面的附录):
$('#exactage').change(
function(){
if ($(this).is(':checked')){
$('#age2').prop('disabled',true);
}
else {
$('#age2').prop('disabled',false);
}
});
On the change
event of the #exactage
checkbox the if
checks whether $(this)
is, or is not, :checked
. 在#exactage
复选框的change
事件中, if
检查$(this)
是否$(this)
:checked
。 If it is then it sets the disabled
property of the #age2
element, otherwise it removes/unsets the disabled
property. 如果是,则设置#age2
元素的disabled
属性,否则它将删除/取消设置disabled
属性。
References: 参考文献:
change()
. change()
。 :checked
selector . :checked
选择器 。 is()
. is()
。 prop()
. prop()
。 If by enabled you mean checked 如果启用,则表示已选中
if(document.getElementById('exactage').checked)
document.getElementById('age2').setAttribute('disabled', 'disabled');
If by enabled you actually mean enabled, you can do this: 如果“启用”实际上是指“启用”,则可以执行以下操作:
if(document.getElementById('exactage').getAttribute('disabled') !== null)
document.getElementById('age2').setAttribute('disabled', 'disabled');
You can try onclick or onselect (I think there is something like that) attribute to call a method In the method try 您可以尝试onclick或onselect(我认为有类似的东西)属性来调用方法在方法try中
document.getElementById('age2').setEnabled(false)
or 要么
document.getElementById('age2').disabled=disabled
Something along that line.. I can't remember :( 沿着这条线..我不记得了:(
Try using the following. 尝试使用以下内容。
if(document.getElementById('exactage').checked)
{
document.getElementById('age2').disabled=true;
}
First you need these 首先你需要这些
function changeState(id, state)
{
if(state == 0)
document.getElementById(id).disabled = true;
else
document.getElementById(id).disabled = false;
}
function toggleFields(id, state)
{
var e=document.getElementById(id);
if(!e)return true;
if(state == 1)
{
e.style.display=""
}
else
{
e.style.display="none";
}
return true;
}
Followed by these 其次是这些
function checkBoxState(check_box_id, field_id, flag)
{
if(document.getElementById(check_box_id).checked)
{
if(flag == 1)
toggleFields(field_id, 1);
else if(flag == 0)
changeState(field_id, 1);
document.getElementById(check_box_id).value = 1;
} else {
if(flag == 1)
toggleFields(field_id, 0);
else if(flag == 0)
changeState(field_id, 0);
document.getElementById(check_box_id).value = 0;
}
}
function reversedCheckBoxState(check_box_id, field_id, flag)
{
if(document.getElementById(check_box_id).checked)
{
if(flag == 1)
toggleFields(field_id, 0);
else
changeState(field_id, 0);
document.getElementById(check_box_id).value = 1;
} else {
if(flag == 1)
toggleFields(field_id, 1);
else
changeState(field_id, 1);
document.getElementById(check_box_id).value = 0;
}
}
And now all you will have to do is to run reversedCheckBoxState("exactage", "age2" 0) Or you can run reversedCheckBoxState("exactage", "age2" 1) 现在,您要做的就是运行reversedCheckBoxState(“ exactage”,“ age2” 0)或运行reversedCheckBoxState(“ exactage”,“ age2” 1)
Enjoy! 请享用!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.