[英]Disable a textbox if checkbox is checked
I have an HTML table where there is a checbox and a textbox in everyrow. 我有一个HTML表,每个行中都有一个检查框和一个文本框。 The idea here is every time a checkbox is checked, the textbox will be disabled. 这里的想法是,每当选中一个复选框时,该文本框将被禁用。 Here is the code: 这是代码:
<table>
<tr>
<td>Value1</td>
<td>Value2</td>
<td><input type="text" class="textbox" /></td>
<td><input type="checkbox" class="Blocked" onclick="myFunction(this)"/></td>
</tr>
</table>
<script src="/Scripts/jquery-1.7.1.js"></script>
<script type="text/javascript">
function myFunction(chk) {
//disable the textbox here
}
</script>
Can you help me with this? 你能帮我吗? Also, if I unchecked the checbox, I want my textbox to be enabled back. 另外,如果取消选中复选框,则希望重新启用文本框。 Thanks!! 谢谢!!
Would something like below work for you? 下面的内容对您有用吗?
$('.Blocked').change( function() {
var isChecked = this.checked;
if(isChecked) {
$(this).parents("tr:eq(0)").find(".textbox").prop("disabled",true);
} else {
$(this).parents("tr:eq(0)").find(".textbox").prop("disabled",false);
}
});
JSFiddle: http://jsfiddle.net/markwylde/LCWVS/6/ JSFiddle: http : //jsfiddle.net/markwylde/LCWVS/6/
Compacted, it would look a little like: 压缩后,它看起来像:
$('.Blocked').change( function() {
$(this).parents("tr:eq(0)").find(".textbox").prop("disabled", this.checked);
});
JSFiddle: http://jsfiddle.net/markwylde/LCWVS/4/ JSFiddle: http : //jsfiddle.net/markwylde/LCWVS/4/
Sticking with the inline event handler: 坚持使用内联事件处理程序:
function myFunction(chk) {
$(chk).closest('tr').find('.textbox').prop('disabled', chk.checked);
}
The jQuery way: jQuery方式:
$('.Blocked').change(function() {
$(this).closest('tr').find('.textbox').prop('disabled', this.checked);
});
Try: 尝试:
function myFunction(chk) {
document.getElementsByClassName("textbox")[0].disabled = chk.checked;
}
<input type="text" name="dateFrom" id="t2" style="width:100px"/>
<input type="text" name="dateTo" id="text" style="width:100px"/>
<script>
$(document).ready(function () {
$('#check').change(function () {
$("#t2").attr("disabled", "disabled");
$("#text").attr("disabled", "disabled");
});
$('#check').click(function () {
if (!$(this).is(':checked')) {
$("#t2").removeAttr("disabled");
$("#text").removeAttr("disabled");
}
});
});
</script>
Try this it allows you to disable and enable a textbox, if you want to disable multiple textboxes change it to getElementsByClassName("textboxes") then give all your textfields that class name. 尝试此操作,它允许您禁用和启用文本框,如果要禁用多个文本框,请将其更改为getElementsByClassName(“ textboxes”),然后为所有文本字段指定该类名。
function disableElement()
{
textbox = document.getElementById("text");
if(textbox.disabled)
{
bunit.disabled=false;
}
else
{
bunit.disabled=true;
}
}
Then have a checkbox and a textfield with the the textfield called text 然后有一个复选框和一个带有名为text的文本字段的文本字段
<input type="checkbox" name="check" onclick="disableElement();">
<input type="text" id="text">
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.