Jquery：检查fieldset是否为空

Question

Jquery：检查fieldset是否为空

4

我需要检查DOM中是否有任何空的fieldset。空的意思是它里面没有文本（legend不在内）。例如，这是一个空的fieldset：

<fieldset>
    <legend>a1</legend>
    <input type="hidden" name="x" value="y">
</fieldset>

除了在 legend 元素内部，其他地方都没有文本节点。

到目前为止，我一直使用这个 JQuery 来检查这个条件：

    if ($(this).find(":not(legend)").text().trim() == '') {
    ...
    }

注意，这是从.each()方法调用中获取的。问题在于，我发现它不能在像这样嵌套的fieldset上正常工作：

<fieldset>
    <legend>a</legend>
    <fieldset>
        <legend>a1</legend>
    </fieldset>
    <fieldset>
        <legend>a2</legend>
    </fieldset>
</fieldset>

在这种情况下，jQuery表达式为：

$("fieldset").find(":not(legend)").text().trim()

作为结果返回 "a1 a2"。问题出在哪里呢？JsFiddle

- Ivan

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Keith.Abramo · Accepted Answer

$("fieldset").find(":not(legend):not(fieldset)").text().trim()

您需要考虑包含fieldset的fieldset。选择器的意思是“此fieldset具有另一个fieldset，由于您正在查找不是legend的任何元素，因此这是有效的元素”。它然后在该元素中找到文本a1和a2。

更新：根据您下面的评论，请尝试此解决方案。

$('fieldset').filter(function(index) {
  return $(this)
            .clone()
            .find("legend,fieldset")
            .remove()
            .end()
            .text()
            .trim()
            .length > 0;
});