1

我有一个 HTML 表格，其中每一行都有一个复选框和一个文本框。这里的想法是每次选中复选框时，文本框都会被禁用。这是代码：

 <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>

你能帮我解决这个问题吗？此外，如果我取消选中复选框，我希望我的文本框能够重新启用。谢谢！！

4

5 回答 5

4

像下面这样的东西对你有用吗？

$('.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/

压缩后，它看起来有点像：

$('.Blocked').change( function() {
    $(this).parents("tr:eq(0)").find(".textbox").prop("disabled", this.checked); 
});

JSFiddle：http: //jsfiddle.net/markwylde/LCWVS/4/

于 2013-08-29T21:45:36.877 回答
2

坚持使用内联事件处理程序：

function myFunction(chk) {
    $(chk).closest('tr').find('.textbox').prop('disabled', chk.checked);
}

jQuery方式：

$('.Blocked').change(function() {
    $(this).closest('tr').find('.textbox').prop('disabled', this.checked);
});
于 2013-08-29T21:48:06.013 回答
1 
<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>
于 2013-12-04T12:07:34.917 回答
1

尝试：

function myFunction(chk) {
    document.getElementsByClassName("textbox")[0].disabled = chk.checked;
}
于 2013-08-29T21:48:06.417 回答
0

试试这个，它允许您禁用和启用一个文本框，如果您想禁用多个文本框，请将其更改为 getElementsByClassName("textboxes") 然后为所有文本字段提供该类名。

function disableElement()
{
    textbox = document.getElementById("text");
    if(textbox.disabled)
    {    
        bunit.disabled=false;
    }
    else
    {
        bunit.disabled=true;
    }
}

然后有一个复选框和一个带有名为 text 的文本字段的文本字段

<input type="checkbox" name="check" onclick="disableElement();">
<input type="text" id="text">
于 2013-10-07T11:02:54.810 回答