javascript - 向 jQuery 表单单选按钮添加验证

Question

我正在开发一个表单，需要使用 jQuery 表单验证来确定是否选择了单选按钮。可能有一个 super 简单的解决方案，但我还没有弄清楚。这是我的代码片段:

$bodyFormContainer.append('<div class="formMediumCopy">Are you a Sport&Health member?</div> <br /> <input type="radio" class="" name="webform_member" id="control_COLUMN170_0" value="Member" /> &nbsp; <div class="formMediumCopy">Member</div> <input type="radio" class="" name="webform_member" id="control_COLUMN170_1" value="Non-Member" /> &nbsp; <div class="formMediumCopy">Non-Member</div> <br />')
                .append('<a class="blueButton freePassBtn" href="javascript:FreeTNTHelper.postForm(this);" onclick="return FreeTNTHelper.validateData();" id="freePassBtn">Send Your Request<img src="/images/arrow_btn.png" width="11" height="17" alt="" /></a>');

为了验证，我有:

var FreeTNTHelper = {
validateData: function () {
if (document.getElementById('control_COLUMN170:checked').length < 0) {
        alert("Please indicate if you're a member or non-member.");
        document.getElementById('control_COLUMN170').focus();
        return (false);
    }
},

上面的验证不起作用。如果未选择单选按钮，我需要一个弹出窗口，询问该人是成员(member)还是非成员(member)。

Answer 1

通常情况下，单选框会默认选中一个。我会在那里设置默认选择，可能是非成员(member)。另外，您实际上并不需要 id 属性。

之后，您可以测试

if($("input[name='webform_member']").val() == "Member"){
    //process code here
} else {
    //process code here    
}

这是一个 fiddle 片段 Fiddle for values