1

次の表にいくつかの行があり、各行内のすべてのコントロールを無効にしたいと考えています。

以下は私のHTMLコードです：

<table id="tblChildData">
    <tr id="trChild2">
        <td>
            2
        </td>
        <td style="height: 30px;">
            <%:Html.TextBoxFor(m=>m.childName2) %><%--<br />
                <%: Html.ValidationMessageFor(m=>m.SpouseName,null,new{@Class="field-validation-message"}) %>--%>
        </td>
        <td style="height: 30px; text-align: center;">
            &nbsp;M<%: Html.RadioButtonFor(m=>m.genderIdChild2,1) %>
            &nbsp;F<%:Html.RadioButtonFor(m=>m.genderIdChild2,2) %>
        </td>
        <td style="height: 30px; text-align: center;">
            <%:Html.TextBoxFor(m=>m.ageChild2,new{Style="width:30px;",maxlength=3}) %><%--<br />
                <%:Html.ValidationMessageFor(m=>m.SpouseAge,null,new{@Class="field-validation-message"}) %>--%>
        </td>
        <td style="height: 30px; text-align: center;">
            &nbsp;&nbsp;&nbsp;Married<%: Html.RadioButtonFor(m=>m.maritialStatusChild2,1) %>
            UnMarried<%:Html.RadioButtonFor(m=>m.maritialStatusChild2,2) %>
        </td>
    </tr>
</table>

以下は、各テーブル行内のコントロールを無効にするために使用した jQuery のコードです。

$("#trChild2").find("input,button,textarea").attr("disabled", true);
$("#trChild2").hide();
$("#trChild3").find("input,button,textarea").attr("disabled", true);
$("#trChild3").hide();
$("#trChild4").find("input,button,textarea").attr("disabled", true);
$("#trChild4").hide();
$("#trChild5").find("input,button,textarea").attr("disabled", true);
$("#trChild5").hide();
$("#trChild6").find("input,button,textarea").attr("disabled", true);
$("#trChild6").hide();
$("#trChild7").find("input,button,textarea").attr("disabled", true);
$("#trChild7").hide();
$("#trChild8").find("input,button,textarea").attr("disabled", true);
$("#trChild8").hide();
$("#trChild9").find("input,button,textarea").attr("disabled", true);
$("#trChild9").hide();
$("#trChild10").find("input,button,textarea").attr("disabled", true);
$("#trChild10").hide();
$("#trChild11").find("input,button,textarea").attr("disabled", true);
$("#trChild11").hide();
$("#trChild12").find("input,button,textarea").attr("disabled", true);
$("#trChild12").hide();

しかし、テーブルの行のみを非表示にし、行内のコントロールを無効にしない理由がわかりません...

私はjsfiddleでもこれを試しましたが、うまく動作しているようです: http://jsfiddle.net/3QuT4/1/

私を助けてください..

ありがとう、

男

4

1 に答える 1

2

<tr>テーブルの各行に一意の ID を割り当てる必要はありません。次のセレクターを使用して、テーブル内のすべての入力フィールドを無効にすることができます。

$('table :input').prop('disabled', true);

jQuery 1.6 以降を使用している場合ではなく、 using.prop()を使用してフィールドを無効にすることをお勧めします。.attr()

特定の行のみを無効にする場合は、それらの行を同じクラスに適用してから、次のようにします。

$('table tr.someClassName :input').prop('disabled', true);

ID を使用し、ID ごとに同じ jQuery セレクターを繰り返すことは、問題に取り組むための非常に単純なアプローチのように思えます。

于 2012-09-22T14:42:18.593 に答える