【问题标题】:Jquery for checkbox doesn't work for model popup复选框的 Jquery 不适用于模型弹出窗口
【发布时间】:2016-02-05 03:29:43
【问题描述】:

在 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 运行时错误:检查未定义错误。

【问题讨论】:

  • 'EnableSubmitButton' 不是有效的 javascript 属性。
  • 您可以操作任何元素属性,即使它不可见或不被 DOM 使用。 @DinoMyte - 想想 aria- 属性
  • 是的。我会纠正的。问题是它无法识别函数 Checked()

标签: javascript jquery asp.net checkbox


【解决方案1】:

将此代码移动到正文标记的末尾

<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;

【讨论】:

    【解决方案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>
    

    【讨论】:

    【解决方案3】:

    您可以在复选框上使用 jquery 'change' 事件委托,并使用它的属性来确定是否禁用按钮。

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

    例如:https://jsfiddle.net/DinoMyte/h712mu20/2/

    【讨论】:

      猜你喜欢
      • 2012-11-06
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2016-06-05
      • 1970-01-01
      • 2017-11-22
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多