单击“继续”按钮之前的复选框验证

Question

<a href="page.html" > <button type="button" id="proceed-button">Proceed </button></a>
<input type="checkbox" name="checkbox3" value="yes">
By checking the box, I certify that have read the above disclaimers and agree to the rules. </input>

我

有一个复选框和一个按钮，可以将我带到下一页。但是，在我按下按钮之前，必须勾选复选框。否则，必须在复选框下方显示一个标签，指出"首先接受规则"。帮助？此外，如果我单击继续而不选中复选框，我可以将复选框突出显示为红色，那就太好了。可以使用javascript/jquery。

Answer 1

试试这个它有效

<form action="page.html">
<input type="checkbox" name="checkbox3" value="yes" required>
By checking the box, I certify that have read the above disclaimers and agree to the rules. </input>
<input type="submit" name ="submit"/>
</form>

Answer 2

要帮助您入门：

<input id="checkboxAgree" type="checkbox" name="checkbox3" value="yes">

function checkAgree() 
{
   if (document.getElementbyId("checkboxAgree").getAttribute("checked") )//checkbox is checked
   {
       location.href = "page.html"; //load the next page.
   }
   else
   {
       Alert("You need to check the box before you can continue");
   }
}
document.getElementById("proceed-button").addEventListener("click", checkAgree ,false);

addEventListener将onclick事件添加到button。单击时，这将执行函数checkAgree 。当复选框具有属性checked则选中该复选框，if将呈现为 true。 location.href将加载page.html.

请删除按钮周围的a。