JQuery 验证选择器

Question

我希望使用 JQuery 验证来强制对必填字段等进行一些客户端验证。

场景是我有动态填充的字段，但它们通常以相同的方式布置。我想要一种根据标签是否具有 'required' class 来 select 输入字段的方法。例如在下面的示例中，我想 select 街道 1 和城市但不是街道 2 输入字段：

<div class="form-group">
    <label for="Street1" class="required col-sm-3 control-label">Street Address</label>
    <div class="col-sm-5">
        <input class="form-control input-sm" id="Street1" name="Street1" type="text" value="" />
    </div>
</div>
<div class="form-group">
    <label for="Street2" class="col-sm-3 control-label">Street Address 2&nbsp;</label>
    <div class="col-sm-5">
        <input class="form-control input-sm" id="Street2" name="Street2" type="text" value="" />
    </div>
</div>

<div class="form-group">
    <label for="City" class="required col-sm-3 control-label">City</label>
    <div class="col-sm-5">
        <input class="form-control input-sm" id="City" name="City" type="text" value="" />
    </div>
</div>

我已经试过了，但没有用：

$("label.required  :text").each(function () {
    alert($(this).attr('id') + "  " + $(this).get(0).tagName);
});

Answer 1

在表单提交事件中，您必须使用 class 对每个标签进行迭代并找到它的下一个输入，并验证例如：

$("form").submit(function(){
    var return_state = true;
    $("label.required").each(function(){
    var input = $(this).next().find("input");
        //Validate your input
        //Make return_state = false in case any validation fails
    });
    return return_state;
});

Answer 2

根据您发布的内容，我相信这就是您想要完成的。此代码将仅在每个必填标签后查找 :text 字段。

$('label.required').each(function () {
    var inputField = $(this).next('div').find('input').filter(':text');
    // Do validation of the field here
});

您可以使用变量 inputField 来获取有关该字段的特定数据。例如，如果您想获取字段的 ID，只需调用 inputField.attr('id').

JQuery 验证选择器

JQuery validation selector

html

javascript

validation

jquery