如何为 FF 和 Chrome 禁用 <TD> 内的控件。正常

Question

我在 <td> 中有几个复选框控件，我需要将其禁用，这样用户就无法选中复选框。

这在IE8及以上都有效，但FF或Chrome，disable="disabled"被忽略。为什么以及如何解决这个问题？

    <td id="tdDocs" runat="server" style="table-layout: fixed; visibility: visible; overflow: auto; border-collapse: separate; font-size: 12pt; vertical-align: top; text-align: left; font-weight: bold; font-family: Arial; background-color: transparent; width: 799px; background-image: none;" colspan="2">
        <strong>What documents will be required for today's tasks?<br /></strong>
            <span style="font-size: 9pt">(Please ensure supporting documentation is attached)</span>
        <asp:CustomValidator ID="CustomValidator12" runat="server"
                ErrorMessage='Tick one of the "Documents required today" section tick boxes.' OnServerValidate="CustomValidator12_ServerValidate" ValidationGroup="ValidationGroup1" Font-Names="Arial" Font-Size="9pt">*</asp:CustomValidator><br />
            <table style="width: 651px; font-weight: bold; font-size: 10pt; font-family: Arial;">
                <tr>
                    <td style="font-size: 10pt; font-family: Arial; height: 22px; font-weight: bold; width: 247px;">
                        <strong>
                            <asp:CheckBox ID="chkJSEA" runat="server" Text="JSEA" Width="200px" Font-Names="Arial" Font-Size="10pt" ValidationGroup="ValidationGroup1" /></strong></td>
                    <td style="height: 22px; font-weight: bold; font-size: 10pt; width: 278px; font-family: Arial;"><asp:CheckBox ID="chkRISKA" runat="server" Text="Risk Assessment" Width="200px" Font-Bold="True" Font-Names="Arial" Font-Size="10pt" ValidationGroup="ValidationGroup1" /></td>
                    <td style="height: 22px; font-weight: bold; font-size: 10pt; width: 121px; font-family: Arial;"><asp:CheckBox ID="chkWMS" runat="server" Text="Work Method Statement" Width="200px" Font-Bold="True" Font-Names="Arial" Font-Size="10pt" ValidationGroup="ValidationGroup1" /></td>
                </tr>
                <tr>
                    <td style="font-size: 12pt; width: 247px; font-family: Arial; height: 22px;">
                        <strong>
                            <asp:CheckBox ID="chkSOP" runat="server" Text="Safe Operating Procedures" Width="200px" Font-Names="Arial" Font-Size="10pt" ValidationGroup="ValidationGroup1" /></strong></td>
                    <td style="height: 22px" colspan="2">
                        <asp:CheckBox ID="chkOTHER" runat="server" Text="Other" OnCheckedChanged="chkOTHER_CheckedChanged" AutoPostBack="true" ValidationGroup="ValidationGroup1" />
                        <asp:TextBox ID="txtOtherFlag" runat="server" AutoPostBack="True" ValidationGroup="ValidationGroup1" ></asp:TextBox>
                    </td>
                </tr>
            </table>
    </td>

在代码隐藏中，我有逻辑可以用一行禁用该行及其中的所有内容...

tdDocs.Disabled = True;

Answer 1

如果您设置 disabled 属性，IE 确实会禁用 td（或任何容器）内的所有控件。我什至不知道！

但问题是其他浏览器没有。 disabled 不是 td 的有效属性。请参阅 this fiddle，其中 table 中的复选框在 IE 中变得不可点击，但在其他浏览器中则不会。

解决方案：通过运行快速循环 td 中的所有控件来单独禁用所有控件。
所以而不是

tdDocs.Disabled = true;

写

foreach (Control ctrl in tdDocs.Controls) {
    if (ctrl is WebControl) ((WebControl)ctrl).Enabled = false;
}

如何为 FF 和 Chrome 禁用 <TD> 内的控件。正常

How to disable controls inside a <TD> for FF and Chrome. IE ok

css

html-table

disabled-control