[英]Enable/disable text box on check/uncheck box
I have a checkbox that is enabled by default. 我有一个默认情况下启用的复选框。
The issue here is that once i uncheck it, it remains disabled even when i check it back again. 这里的问题是,一旦我取消选中它,即使我再次选中它,它仍然保持禁用状态。
<input type="checkbox" class="show-check" checked value="1" id="DisplayOnClick">
document.getElementById("DisplayOnClick").onclick = function(){
if(document.getElementById("DisplayOnClick").checked){
document.getElementById("myFieldset").style.display = "block";
} else {
document.getElementById("myFieldset").disabled = !this.checked;
}
}
Also tried this following code but this doesn't do anything. 还尝试了以下代码,但这没有任何作用。
$(function () {
$("#DisplayOnClick").click(function () {
if ($(this).is("checked")){
$("#myFieldset").show();
}else {
$("#myFieldset").hide();
}
});
});
I am not sure what i am doing wrong here. 我不确定在这里我在做什么错。 Any help is appreciated.
任何帮助表示赞赏。 Thank you.
谢谢。
$(function () {
$("#DisplayOnClick").change(function () {
if ($(this).is(":checked")){
$("#myFieldset").removeAttr('disabled')
}else {
$("#myFieldset").attr('disabled', 'true')
}
});
});
This should do what you want. 这应该做您想要的。
The selector for the checkbox needs to be :checked
复选框的选择器需要
:checked
Also a thing I ran into with fieldsets it would seem, is that even if you set disabled=false
, it's still disabled. 我在字段集中遇到的一件事似乎是,即使您设置了
disabled=false
,它仍然处于禁用状态。 It doesn't care what the value of disabled is, only that it exists. 它不关心禁用的值是什么,仅存在它的存在。
Just doing the following worked for me. 只需执行以下对我有用。
document.getElementById("DisplayOnClick").onclick = function(){
document.getElementById("myFieldset").disabled = !this.checked;
}
look at is checked if it is checked then show the fieldset else hide. 查看是否选中,然后显示字段集,否则隐藏。
$('#DisplayOnClick').click((e) => $('#myfieldset')[$(e.target).is(':checked') ? 'show' : 'hide']());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="checkbox" class="show-check" checked value="1" id="DisplayOnClick"> <div id="myfieldset"> hello from my field set </div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.