1

次のコードは、1 つの要素の選択されたプロパティを設定し、チェックボックスがオンになっている値が変更されたときにその要素を切り替えます。

ASP.NET

<asp:CheckBox CssClass="Cb" RunAt="Server"/>
<asp:TextBox CssClass="Txt" RunAt="Server" ReadOnly="True"/>

HTML

<input class="Cb" type="checkbox"/>
<input class="Txt" type="text" readonly="true"/>

Jクエリ

$(".Cb").change(function() {
    $(".Txt").prop("readonly",!this.checked);
});

実施例

http://jsfiddle.net/gKwbn/

問題

このコードを ASP.NET の asp:checkbox で実行すると、input:checkbox でコードを実行した場合と結果が異なります。

input:checkbox を使用すると、読み取り専用状態が次のように切り替わります。

初期状態

<input class="Txt" type="text" readonly="true"/>

トグル

<input class="Txt" type="text"/>
<input class="Txt" type="text" readonly=""/>

asp:checkbox を使用すると、読み取り専用状態が次のように切り替わります。

初期状態

<input class="Txt" type="text" readonly="readonly"/>

トグル

<input class="Txt" type="text" readonly=""/>
<input class="Txt" type="text" readonly=""/>

読み取り専用を理解する

次のすべてのプロパティは、読み取り専用を true に設定するために有効です。

  • 読み取り専用
  • 読み取り専用=""
  • 読み取り専用="真"
  • readonly="読み取り専用"

私の質問

jquery/javascriptでasp.netを使用するときに読み取り専用プロパティを削除してから切り替える方法は?

編集

問題は、asp:checkbox を使用すると、クラスが正しくない要素に適用されることです。

これ

<asp:CheckBox CssClass="Cb" RunAt="Server"/>

ブラウザでのレンダリング

<span class="Cb"><input id="ctl01" type="checkbox" name="ctl01" /></span>

ソリューション

クラスではなく ID を使用して asp:checkbox をターゲットにします。

<asp:CheckBox ID="CBID" CssClass="Cb" RunAt="Server"/>

$("#<%= CBID.ClientID %>").change(function() {
    $(".Txt").prop("readonly", this.checked ? "" : "readonly");
});
4

1 に答える 1

3

私があなたの質問を完全に誤解していない場合は、代わりにこれを使用できます...

$(".Cb").change(function() {
    $(".Txt").prop("readonly", this.checked ? "" : "readonly");
});

これにより、チェックボックスの状態に応じて、readonlyプロパティがいずれかまたは空に設定されます。readonly

これが実用的なフィドルです

編集：更新に加えて、次のようにクラスをチェックボックスに追加できます...

<asp:CheckBox class="Cb" RunAt="Server"/>

または、IDで参照できます...

$("#ctl01").change(function()...

または名前で...

$("input[name=ctl01]").change(function()...

またはそれが範囲内にあるという事実によって...

$(".Cb input:checkbox").change(function()...
于 2013-10-01T09:53:26.773 に答える