Question

我有一组输入字段，其中一些有关联的标签，有些则没有：

<label for="bla">bla</label> <input type="text" id="bla" />

<label for="foo">bla <input type="checkbox" id="foo" /> </label>

<input ... />

那么，如何为每个输入选择相关标签？（

）

Answer 1

您不应该使用prev或next来依赖元素的顺序。只需使用标签的for属性，因为它应该与您当前正在操作的元素的ID相对应：

var label = $("label[for='" + $(this).attr('id') + "']");

但是，在某些情况下，标签不会设置for，在这种情况下，标签将是其关联控件的父级。要在两种情况下找到它，您可以使用以下变体：

var label = $('label[for="' + $(this).attr('id') + '"]');

if(label.length <= 0) {
    var parentElem = $(this).parent(),
        parentTagName = parentElem.get(0).tagName.toLowerCase();

    if(parentTagName == "label") {
        label = parentElem;
    }
}

我希望这有帮助！

Answer 2

有两种方法可以为元素指定标签：

将标签的“for”属性设置为元素的ID
将元素放置在标签内

因此，找到元素标签的正确方法是

   var $element = $( ... )

   var $label = $("label[for='"+$element.attr('id')+"']")
   if ($label.length == 0) {
     $label = $element.closest('label')
   }

   if ($label.length == 0) {
     // label wasn't found
   } else {
     // label was found
   }

Answer 3

只要您的input和label元素与id和for属性相关联，您应该可以执行以下操作：

$('.input').each(function() { 
   $this = $(this);
   $label = $('label[for="'+ $this.attr('id') +'"]');
   if ($label.length > 0 ) {
       //this input has a label associated with it, lets do something!
   }
});

如果未设置for，则元素之间没有任何语义关系，并且在该实例中使用label标签没有任何好处，因此希望您始终可以定义该关系。

jQuery - 选择输入字段的关联标签元素

3 个答案: