Rumah > Artikel > hujung hadapan web > Penyelesaian kepada masalah bahawa sifat Dayakan kawalan Kotak Semak dalam Asp.net tidak boleh ditukar terus menggunakan kemahiran JavaScript script_javascript
Saya menghadapi masalah kecil di tempat kerja hari ini Situasinya adalah seperti berikut Apabila saya menetapkan nilai Dayakan Kotak Semak kepada palsu dalam halaman latar belakang, saya menggunakan skrip (chk.disabled = false) di halaman hadapan. dan tidak dapat diubah dilumpuhkan. Nilainya adalah palsu dan kodnya adalah seperti berikut:
Kod meja hadapan:
<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <script type="text/javascript"> function foo() { var chk = document.getElementById("<%=chkBlog.ClientID %>"); if (chk.disabled) { chk.disabled = false; } else { chk.disabled = true; } } </script> </head> <body> <form id="form1" runat="server"> <div> <asp:CheckBox ID="chkBlog" runat="server" Text="http://owen-zhang.cnblogs.com"></asp:CheckBox> <asp:Button ID="btnCheck" runat="server" Text="Client check" OnClientClick="foo();return false;" /> </div> </form> </body> </html>
Kod hujung belakang:
protected void Page_Load(object sender, EventArgs e) { this.chkBlog.Enabled = false; }
Mengapa ini berlaku? Mari kita lihat kod sumber html, seperti berikut:
<span disabled="disabled"> <input id="chkBlog" type="checkbox" name="chkBlog" disabled="disabled" /> <label for="chkBlog">http://owen-zhang.cnblogs.com</label> </span>
Ternyata apabila atribut Dayakan kawalan Kotak Semak adalah palsu, output kepada Html menjadi satu set kawalan (elemen), bukan satu kawalan seperti yang kami jangkakan.
Pilihan 1:
Dalam kod di atas, walaupun kami menukar atribut lumpuh kawalan chkBlog kepada palsu, atribut lumpuh nod induk (45a2772a6b6107b401db3c9b82c049c2) kawalan chkBlog masih dilumpuhkan. Ini mempunyai isu keutamaan Secara amnya, keutamaan nod induk adalah lebih tinggi daripada nod anak Oleh itu, kita perlu menukar nilai nod induk yang dilumpuhkan Kod skrip klien di atas perlu diubah sedikit, seperti berikut :
<script type="text/javascript"> function foo() { var chk = document.getElementById("<%=chkBlog.ClientID %>"); if (chk.disabled) { chk.parentNode.disabled = false; chk.disabled = false; } else { chk.parentNode.disabled = true; chk.disabled = true; } } </script>
Hanya tambahkan kod yang diserlahkan di atas.
Pilihan 2:
Jika anda menggunakan pilihan satu, anda mesti menambah pernyataan tambahan untuk menukar atribut nod induk yang dilumpuhkan Apabila terdapat banyak tempat untuk diubah suai, ia akan menjadi lebih menyusahkan, dan ia tidak mematuhi logik kod umum dan. adalah kod berlebihan. Adakah terdapat cara lain yang lebih mudah? Ya~, kami hanya perlu mengubah suai kod latar belakang, seperti berikut:
protected void Page_Load(object sender, EventArgs e) { this.chkBlog.InputAttributes.Add("disabled", "disabled"); }
Iaitu, kami tidak menukar atribut Dayakan Kotak Semak, tetapi menukar output kandungan Html dengan Kotak Semak kepada klien melalui tetapan atribut dalam InputAttributes, seperti berikut:
<input id="chkBlog" type="checkbox" name="chkBlog" disabled="disabled" /> <label for="chkBlog">http://owen-zhang.cnblogs.com</label>
Nod induk "berlebihan" sebelum ini kini hilang.