【问题标题】:Button enabled or disabled when checkbox is checked or not选中或不选中复选框时启用或禁用按钮
【发布时间】:2015-12-09 13:51:16
【问题描述】:

我这里有一个代码,每当我选中一个复选框时,按钮就会启用,但如果我取消选中它,按钮将被禁用。我的问题是,当我添加另一个复选框时,按钮的禁用和启用不起作用。输出应该是每当我选中一个或多个复选框时,该按钮将启用,但如果没有选中复选框,则应禁用该按钮。有谁知道我该怎么做?

这是我的代码:

        <HTML>
            <HEAD> 
            <SCRIPT LANGUAGE="JavaScript">

            function Disab(id) 
            {
                if(document.form1.cbox.checked) 
                {
                    document.form1.Button1.disabled=false
                }
                else {
                    document.form1.Button1.disabled=true
                }
            }

            </SCRIPT>

            </HEAD>
            <BODY TEXT="000000" BGCOLOR="FFFFFF">

            <form name="form1">
            <div align="center"> 
            <input name="cbox" type="checkbox" id="cbox2" value="checkbox" onClick=Disab(this.id);>
            Click here to Enable/Disable Button<br /><br />
            <input type=button onClick="alert('Button pressed!')" value="Button" name="Button1" disabled>
            </div>
            </form>
            </BODY>
            </HTML>

【问题讨论】:

    标签: javascript button checkbox


    【解决方案1】:

    我的问题是,当我添加另一个复选框时,按钮的禁用和启用不起作用。

    如果选中一个或多个复选框,您是否尝试启用/禁用按钮?

    function verifyChecked() {
      var inputs = document.querySelectorAll("#myForm input[type='checkbox']");
      var atLeastOneChecked = false;
    
      for(var i = 0; i < inputs.length && !atLeastOneChecked; i++) {
        if(inputs[i].checked) {
          atLeastOneChecked = true;
        }
      }
    
      document.form1.Button1.disabled = !atLeastOneChecked;
    }
    

    【讨论】:

    • 如果我添加另一个复选框,我将如何使用该代码?
    • 脚本循环遍历该表单中的所有复选框。
    • 复选框中 onClick 的值是多少?
    • &lt;input onclick="verifyChecked()"&gt;&lt;/input&gt;
    • 阅读代码并理解它。我没有写它来复制粘贴。例如,您没有 ID 为 myForm 的元素。
    猜你喜欢
    • 2018-11-07
    • 2018-01-27
    • 1970-01-01
    • 1970-01-01
    • 2012-08-12
    • 2018-11-03
    • 1970-01-01
    • 1970-01-01
    • 2015-08-02
    相关资源
    最近更新 更多