復選框的jQuery不適用於模型彈出窗口

Question

在ModalPopupExtender控件中，我有一個復選框。 選中復選框后，我希望啟用或禁用彈出窗口中的“提交”按鈕。

 <asp:CheckBox ID="chkUser" TabIndex="0" runat="server" CssClass="cCheckBox" ClientIDMode="Static" onchange="Checked();"/>

  src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script type = "text/javascript"> function Checked() { if(document.getElementById('<%=chkUser.ClientID%>').checked) { document.getElementById('<%=btnSubmit.ClientID%>').EnableSubmitButton = true; } } </script> 

我收到以下錯誤。

0x800a1391-JavaScript運行時錯誤：檢查了未定義的錯誤。

Answer 1

將此代碼移到body標簽的末尾

<script type = "text/javascript">

  function Checked() {
    if(document.getElementById('<%=chkUser.ClientID%>').checked) {
      document.getElementById('<%=btnSubmit.ClientID%>').disabled = true;
    }
  }
</script>

另外，您可能需要處理復選框更改事件。

document.getElementById('<%=chkUser.ClientID%>').onchange = Checked;

Answer 2

單擊更改為onchange="Checked(this);" 。

<asp:CheckBox  onchange="Checked(this);" ID="chkUser" TabIndex="0" runat="server" CssClass="cCheckBox" ClientIDMode="Static"/>

<script type="text/javascript">
    function Checked(ele) {
        document.getElementById('<%=btnSubmit.ClientID%>').disabled = !ele.checked;
    }
</script>

Answer 3

您可以使用jQuery“ change中的復選框”事件委派和使用它的屬性檢查，以確定是否禁用按鈕與否。

$().ready(function(){
      $('#<%=chkUser.ClientID%>').on('change',function(){           
       $('#<%=btnSubmit.ClientID%>').prop("disabled",!$(this).prop("checked"));
      });
});

范例： https : //jsfiddle.net/DinoMyte/h712mu20/2/