勾选同意条款复选框无法阻止用户继续操作的问题求助

核心问题1：脚本执行时机错误 #

你的脚本写在<input>元素之前，浏览器从上到下解析HTML时，脚本运行阶段cb（复选框）和button（提交按钮）还未被渲染到DOM中，document.getElementById会返回null，导致后续的button.disabled = true、点击事件绑定全部失效，按钮始终处于可用状态。

核心问题2：语法错误 #

点击事件的判断条件里重复写了checked：

if(cb.checked checked){

这是无效语法，浏览器会直接忽略这段逻辑，即便脚本能正常执行，按钮状态也无法正确切换。

修复后的完整代码 #

<form action="form.php">
  <input type="checkbox" id="cb" name="checkbox">
  <font face="Arial, Helvetica, sans-serif" color="#FFFFFF">I Have Read And
  Agree To The Terms And Conditions<br>
  (check the box if you agree and want to continue)
  </font>
  <br>
  <input type="submit" id="button" value="CONTINUE" name="submit" class="button">

  <script>
      var cb = document.getElementById("cb"),
      button = document.getElementById("button");
      button.disabled = true;
      cb.onclick = function(){
        if(cb.checked){
          button.disabled = false;
        }
        else{
          button.disabled = true;
        }
      };
  </script>
</form>

额外优化建议（可选） #

• 用addEventListener替代onclick，兼容性更好且支持绑定多个事件：

  cb.addEventListener('change', function() {
    button.disabled = !this.checked;
  });
  

• 替换<font>标签，用CSS控制文字样式，更符合现代HTML规范。

内容的提问来源于stack exchange，提问作者Peredy