Question

我是网络开发的新手，我需要有关如何做这件事的建议。这种功能最好和最常用的方法是什么？

直接在“提交”按钮上，有三个复选框。必须检查第一个，以便消费者移动到下一页。如果没有检查，我需要在提交时通知消费者他们需要检查它才能继续。

Answer 1

简单。将onsubmit事件处理程序连接到表单，如下所示：

<script>
document.getElementById("theForm").onsubmit = function() {

     // false is returned when the checkbox is not checked
     // thereby preventing form submission
     return document.getElementById("myCheckbox").checked;   
}
</script>

示例标记：

<form id="theForm">
    <input type="checkbox" id="myCheckbox"/>
    <input type="submit"/>
</form>

Demo here.

Answer 2

JS：

function validate()
{
  if(!document.getElementById('id-of-checkbox-1').checked)
  {
    alert('Check the box!');
    return false;
  }

  return true;
}

HTML：

<form onsubmit="return validate();">
  <!-- form content -->
</form>

单击提交按钮，将执行JS函数验证。如果选中ID为“id-of-checkbox-1”的复选框未，则用户会收到警报并且函数返回false，否则返回true。在表单的onsubmit属性中，它显示return validate();，因为函数的结果也必须返回给浏览器。如果返回false，则不提交表单;否则就是。

Answer 3

有人在工作，只是让我做一些类似于这个问题的内容。这是my solution：

HTML：

<p>Mark the following checkbox:</p>
<form>
<p><label><input type="checkbox" id="chk" />Checkbox</label></p>
<p><button id="continue" disabled="disabled">Continue</button></p>
</form>

JavaScript（假设存在JQuery库）：

$(function() {
    $('#chk').click(function() {
        $('#continue').prop(
            'disabled',
            (!$(this).prop('checked'))
        );
    });
});

按钮continue被禁用，直到用户标记复选框。（这可以是<input type="submit">或可以启用/禁用的任何其他类型的小部件。）

选中复选框以转到下一页

3 个答案: