javascript - 使用 jQuery Validator 插件将 "yes/no"单选按钮验证为特定的正确值

Question

并尽力了解 jQuery 验证器插件。

我已经广泛搜索，但找不到与我想要实现的目标相似的东西。请有人帮忙。

我正在尝试使用单选按钮构建问卷表单，并使用 jQuery 验证器插件对其进行验证。

我将如何设置特定于某些答案的验证规则是"is"或“否”值:

<p>Are you a member of our group? <br />
 <input type="radio" name="member" value="Yes" class="required" id="memberYes" /> 
 <label for="memberYes">Yes</label> <<<<----User must be a member and select 'Yes'
 <input type="radio" name="member" value="No" id="memberNo" />
 <label for="memberdNo">No</label>
</p>

<p>Are you currently under investigation? <br />
 <input type="radio" name="investigation" value="Yes" class="required" id="investigationYes" /> 
 <label for="investigationYes">Yes</label>
 <input type="radio" name="investigation" value="No" id="investigationNo" />
 <label for="investigationNo">No</label> <<<<----User must select 'No' or a message pops up to send them to the correct form
</p>

<p>Has your cat turned green? <br />
 <input type="radio" name="greenCat" value="Yes" class="required" id="greenCatYes" />   <label for="greenCatYes">Yes</label> <<<<---- User must select 'Yes' This is only for users who's cat's are green
 <input type="radio" name="greenCat" value="No" id="greenCatNo" />
 <label for="greenCatNo">No</label>
</p>

<p>Are you currently on the diet? <br />
 <input type="radio" name="diet" value="Yes" class="required" id="dietYes" /> 
 <label for="dietYes">Yes</label> <<<<----User must select the 'Yes' option.
 <input type="radio" name="diet" value="No" id="dietNo" />
 <label for="dietNo">No</label>
</p>

我尝试了以下方法，但似乎都不起作用:

$('#Form').validate({
rules: {
    member:{required: function() {
        $('input[name="member"]:checked').val() === 'Yes';
    }
},
investigation:{required: function() {
    return $('#investigationNo').is(':checked');
    }
},
greenCat:{required:true},
diet:{required:'#dietYes:checked'}

致以最诚挚的问候，并在此先感谢您的帮助

我尝试添加一个新方法，但不知何故它似乎不起作用。

jQuery.validator.addMethod('correctAnswerRadio', function(value, element) {
    var selectedVal = $('input[name='+element+']:checked').val();
    alert(element.name + selectedVal + value);
    if(selectedVal === value){ //Correct Value
        return true;
    }else{ 
        return false;
    }
});`

我将其更改为:

$('#Form').validate({
    rules: {
        member:{required:true,correctAnswerRadio:'Yes'},
        investigation:{required:true,correctAnswerRadio:'No'},
        greenCat:{required:true,correctAnswerRadio:'Yes'},
        diet:{required:true,correctAnswerRadio:'Yes'}
    }
});

该方法仅在 correctAnswerRadio:'No' 时将“value”警告为“Yes”值。我可能做错了什么？

Answer 1

我知道这是一个旧帖子，但谷歌仍然把人们带到这里。

我找到了一个简单的方法来解决它。它不在 jquery 验证器的文档中，但已解决。

首先，您必须选择一个 radio 。它可能是“否”。该值可以是任何值，但我使用“True”或“False”

其次在 javascript 中执行此操作(假设您的字段名称是 terms)

$('form').validate({
  rules:{
    terms: {min:"True"}
  },
  messages:{
    terms: {min:'you must accept terms to move on.'}
  }
});

我在 jsfiddle 做了一个例子:http://jsfiddle.net/ThcS8/117/