Question

我有一张表格。结构如下所示：

<p class="elementWrap">
  <label>Name</label>
  <input class="form_elem" type="text" name="form_name">
</p>

但有时结构看起来像这样：

<p class="elementWrap">
  <label>Phone</label>
  <input class="form_elem" type="text" name="form_phone">
  <span class="form_required">*</span>
</p>

所以还有一个额外的跨度。现在我想给出标签，它们旁边有一些带有jQuery的样式。

到目前为止我的代码：

jQuery('.elementWrap').each(function() {
  if(jQuery('span.form_required').parents(this).length == 1) {
    jQuery(this).find('label').css({'width':'auto','margin':'0px'});
  }
});

但这似乎不起作用......（我尝试了很多if语句，但到目前为止还没有工作= /

Answer 1

您可以使用.filter和.children来选择所有具有直接.elementWrap孩子的.form_required个对象 - 然后在该子集中找到标签：

$(".elementWrap").filter(function() {
    return $(this).children(".form_required").length;
}).find("label").css({'width':'auto','margin':'0px'});

jsFiddle

几乎总有办法避免使用.each和大量if语句。

Answer 2

您可以使用:has()伪选择器，例如：

$('.elementWrap:has(.form_required)').find('label').css({'width':'auto','margin':'0px'});

DEMO

Answer 3

这样做：

$('p.elementWrap').each(function(){

if($(this).find('span.form_required').length > 0)
{
    $(this).find('label').css('background','red');
    // do whatever needed
}

})

Here is Fiddle DEMO

Answer 4

尝试：

$('.elementWrap').each(function () {
    if ($(this).find('span.form_required').length != 0) {
        $(this).find('label').css({
            'width': 'auto',
            'margin': '0px'
        });
    }
});

DEMO

Answer 5

试试这个：

jQuery('.elementWrap').has('.form_required').find('label').css({'width':'auto','margin':'0px'});

我为你做了一个JSFiddle： Click for the fiddle

说明：首先，我用elementWrap类选择每个元素（不需要每个元素）但我只选择那些带有带有.has（）方法的form_required类的子项。从那些elementWrap元素我想找到标签并应用一些自定义样式！

希望这能帮到你！

检查容器是否包含Element

5 个答案:

DEMO