复选框不能取消选中答案

【问题标题】：Checkbox can't be unchecked复选框不能取消选中
【发布时间】：2014-05-28 21:20:39
【问题描述】：

我目前正在尝试解决我的 jquery 和我的 html 表单的问题。

问题：我有一个复选框，允许人们检查接受或不接受条款和条件。此复选框由名为 validateAccept() 的 jquery 函数验证。但是，在我插入 if valid return true 并且 if not valid return false 后，复选框对单击无响应。我是 jquery 的初学者。我不确定哪一部分出了问题。

我的 HTML 代码：

<form action="<? echo $filename; ?>" id="acceptanceForm" name="acceptanceForm" method="post">
  <p>Terms and conditions.......</p>
  I ACCEPT THE TERMS AND CONDITIONS
  <input type="checkbox" name="accept" id="accept" value="yes"/>
  <span id="acceptInfo" class="inputInfo"></span>
</form>

我的 jQuery 验证代码：

$(document).ready(function(){

//Validation (TERMSANDCONDITION)
//termsandconditions variables
var acceptanceForm = $("#acceptanceForm");
var accept = $("#accept");
var acceptInfo = $("#acceptInfo");

//Trigger validation
//On blur
accept.click(validateAccept);
//On key press
accept.keyup(validateAccept);
//On submit
acceptanceForm.submit(function () {
    if (validateAccept()) 
        return true
    else 
        return false;
});

//Validation
//validate accept

function validateAccept() {
    var isChecked = $('#accept').is(':checked');
    if (isChecked) {
        accept.removeClass("error");
        acceptInfo.text("Thanks");
        acceptInfo.removeClass("error");
        acceptInfo.removeClass("inputInfo");
        acceptInfo.addClass("validated");
        return true;
    } else {
        accept.addClass("error");
        acceptInfo.text("Please Read and Accept the Terms and Conditions");
        acceptInfo.removeClass("inputInfo");
        acceptInfo.removeClass("validated");
        acceptInfo.addClass("error");
        return false;
    }
}

我知道的：我知道问题出在我添加的 return true 和 return false 上。我在 JS Fiddle 上尝试不使用它们，并且复选框有效，但表单无效。因此，我知道 return true 和 false 是必要的，但我真的不知道应该如何整理它们以使其工作。我做了一些研究并意识到与我相似的小案例。这种验证技术应该适用于文本输入，所以我不确定我编辑它的方式是否适用于复选框。

JSFiddle

【问题讨论】：

我可以选中和取消选中你 Fiddle 中的复选框，这不是你问的吗？
你忘了在你的小提琴中包含 jQuery
@Hatsjoem 我忘了包含 jQuery。
@j08691 感谢您告诉我。我刚改了。谢谢

标签： javascript jquery html validation checkbox

【解决方案1】：

我找到了答案。我可以改用.change(validateAccept);。它的工作方式与我想要的完全一样。谢谢大家。

JSFiddle

【讨论】：

【解决方案2】：

问题是在单击处理程序中返回 false 会阻止默认行为。如果您需要在这两种情况下都使用它，但在单击处理程序的情况下忽略返回值，您可以这样做：

accept.click(function(){
    validateAccept();
});

http://jsfiddle.net/8JdRb/1/

在这种情况下，点击处理函数没有返回值，不影响复选框的功能。

【讨论】：