Question

我有一个Telerik MVC网格，其中有一些列。在第一列中，我有一个复选框，而Last列是一个文本框。我想在点击我之前设置为禁用的复选框时启用/禁用文本框。

为此，我在我的js中做了这个：

function enableTextBox() {
    $('[name="Checkbox1"]:checked').change(function () {
        var row = $(this).closest('tr');
        if ($(this).is(':checked')) {
            row.find('#Salary').removeAttr('disabled');
        }
        else {
            row.find('#Salary').attr('disabled', 'disabled');
        }
    });
    return true;
}

我的问题是：在Firefox中，此功能正常工作。即单击复选框，我的文本框即可启用。

但是在IE9中，我需要点击两次才能启用文本框。

我该怎么做？

任何建议都将受到赞赏

Answer 1

删除：checked伪类并将'attr'切换为'prop'。这是您尝试做的简化示例：

HTML：

<input type="checkbox">
<input type="textbox" disabled="disabled">
<br />
<input type="checkbox">
<input type="textbox" disabled="disabled">
<br />
<input type="checkbox">
<input type="textbox" disabled="disabled">
<br />
<input type="checkbox">
<input type="textbox" disabled="disabled">
<br />
<input type="checkbox">
<input type="textbox" disabled="disabled">
<br />

jquery的：

$('input[type="checkbox"]').change(function () {
        var checkbox = $(this);
        checkbox.next().prop('disabled', !checkbox.is(':checked'));
    });

本质上它的作用是将更改事件绑定到所有复选框，并将下一个元素（在我的情况下是一个文本框）禁用状态设置为复选框选中状态。

您的代码可以像这样更新：

function enableTextBox() {
    $('[name="Checkbox1"]').change(function () {
        var checkbox = $(this);
        var row = checkbox.closest('tr');
        row.find('#Salary').prop('disabled', !checkbox.is(':checked'));

    });
    return true;
}

你必须从某个地方调用enableTextBox函数来触发它，但这应该可行。

试试这个jsfiddle，让我知道这是不是你想要的

启用文本框功能在IE9中不起作用

1 个答案: