Question

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

问题：我有一个复选框，允许人们检查是否接受条款和条件。此复选框由名为validateAccept（）的jquery函数验证。但是，在我插入if有效返回true之后，如果无效则返回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;
    }
}

我所知道的：我知道问题在于返回true并且返回false我添加了。我在JS Fiddle上没有它们尝试过，复选框正在工作，但表单不是。因此，我知道返回真假是必要的，但我真的不知道应该如何对它们进行排序以使其正常工作。我做了一些研究，并意识到与我的相似的小小案例。这种验证技术假设在文本输入上工作，所以我不确定我编辑它的方式是否可以用于复选框。

JSFiddle

Answer 1

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

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

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

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

Answer 2

我找到了答案。我可以使用.change(validateAccept);代替。它会像我想的那样完全一样。谢谢大家。

JSFiddle

复选框无法取消选中

2 个答案: