如果未选中复选框，如何禁用注册按钮

How to disable sign up button if checkbox is not checked?

本文关键字：何禁用 注册 按钮 复选框 如果      更新时间：2023-09-26

我试图使用HTML放置注册页面，我想进行验证，如果复选框未选中，我想禁用注册按钮，这是我下面所说的吗？什么是特定的HTML5代码？

EnableSubmit = function(val)
{
    var sbmt = document.getElementById("Accept");
    if (val.checked == true)
    {
        sbmt.disabled = false;
    }
    else
    {
        sbmt.disabled = true;
    }
}

这是我的按钮和复选框UI 代码

<div class="form-group">
    <a href="index.html" class="btn btn-primary pull-right" id="button">Sign Up!</a>
    <label class="terms" id="terms"><input type="checkbox"> I agree with the <a href="terms-and-conditions.html">Terms and Conditions</a></label>
</div>


var EnableSubmit = function(val) {
  var lnk = document.getElementById("button");
  val ? lnk.classList.remove('disabled') : lnk.classList.add('disabled');
};
var isAgreed = function() {
  return -1 === document.getElementById("button").className.split(" ").indexOf('disabled');
};
<div class="form-group">
  <a href="index.html" onclick="return isAgreed();" class="disabled btn btn-primary pull-right" id="button">Sign Up!</a>
  <label class="terms" id="terms">
    <input type="checkbox" onchange='EnableSubmit(this.checked);'>I agree with the <a href="terms-and-conditions.html">Terms and Conditions</a>
  </label>
</div>

这将执行以下操作：

<input onclick="EnableSubmit(this)" type="checkbox">

假设表单中有一个ID为"Accept"的提交按钮。你可以给它一个相同值的名称并使用：

  <input type="checkbox" onclick="this.form.Accept.disabled=!this.checked">

但是，这并不能保证在提交表单时选中复选框。此外，如果默认情况下禁用了提交按钮，则没有脚本的用户可能无法提交表单。请考虑默认启用该按钮，然后使用脚本禁用该按钮。

HTML代码

<div class="form-group">
    <a href="index.html" class="btn btn-primary pull-right" id="sbmt_btn" onclick="my_func()">
        Sign Up!
    </a>
    <label class="terms" id="terms">
            <input type="checkbox" id="chkbox_accept">
            I agree with the 
            <a href="terms-and-conditions.html">Terms and Conditions</a>
    </label>

JavaScript函数

function my_func(){
var chk_box = document.getElementById("chkbox_accept");
var submt_btn = document.getElementById("sbmt_btn");
if (chk_box.checked == true)
{
    submt_btn.disabled = false;
}
else
{
    submt_btn.disabled = true;
}
}
相关文章：