Question

我正在尝试将class="required"添加到label元素，其中最简单的形式（输入类型=“文本”，出现在我们的表单软件的以下结构中：

<div>
    <label>X</label>
</div>
<input required type="text">

基本上，标签包含在div中，因此以下方法很有效：

var a = $('*[required]').prev();
var b = a.find('label');
if (b)
    b.addClass('required');

但是，有时<input>和<label>之间的差距会更大，例如，当它是一个单选按钮时：

 <div>
    <label>X</label>
</div>
<span>
    <div>
        <input required type="radio">
    </div>
</span>

那么，如果标签更进一步，我该如何定位标签呢？我试过链接.prev()，但无法让它工作。

Answer 1

如果正确使用标签会更容易。使用for属性将其绑定到基于ID的输入（确保输入上的ID都是唯一的）：

<div>
    <label for="foo">X</label>
</div>

<input id="foo" required type="text"/>

$('*[required]').each(function() {
    var l = $('label[for="' + this.id + '"]');
    if(l.length > 0) {
        l.addClass('required');
    }
    else {
        // some convoluted and easily broken DOM traversal fallback
    }
});

jQuery：使用prev（）定位元素

1 个答案: