Question

我有一个表，其中有几列没有必填字段。这个页面有一个机制来过滤掉正在客户端完成的表中的内容，我使用jQuery来选择要隐藏的元素，但事情似乎没有按预期工作。如果我按某些字符串过滤它会正常工作，但是空过滤器的行为应该只留下那列中包含空单元格的行。

示例表：

<table>
  <tr>
    <td class="firstCol">Some text</td>
    <td class="secondCol"><a href="##">A link!</a></td>
  </tr>
  <tr>
    <td class="firstCol"></td>
    <td class="secondCol"></td>
  </tr>
</table>

对于第一栏，我正在做类似的事情：

$('table tr').find('.firstCol:not(:empty)').parent().hide();

这适用于此专栏。所有仍然可见的是第一列中没有内容的行。

如果我这样做：

$('table tr').find('.secondCol:not(:empty)').parent().hide();

删除第2列中的所有行。是否有一种通用的方法来选择它以仅在没有内容时返回与此行为匹配的<td>？不是它应该重要，但这些是从查询生成的行，我已经在浏览器中检查过，并且单元格没有内容。

提前致谢。

Answer 1

我不确定我理解你的问题。看一下这个jsFiddle。它完全符合您的要求。

$('table tr').find('.firstCol:not(:empty)').parent().hide();

如果firstCol td中有内容，则隐藏包含它的tr（包括secondCol td，无论它是否有内容）。

$('table tr').find('.secondCol:not(:empty)').parent().hide();

如果secondCol td中有内容，则隐藏包含它的tr（包括firstCol td，无论它是否有内容）。

使用您提供的HTML，两个JS片段最终都会做同样的事情。他们隐藏了第一个tr。

Answer 2

虽然@Steve在功能上是正确的，但这应该适用于Chrome开发者工具中不可见的所有元素，Chrome和FireFox jQuery在评估:empty时会注意到许多字符，而Internet Explorer则没有。我想我应该分享我找到的东西。

确定单元格是否应包含内容的条件代码如下所示：

<td class="secondCol">
   <CFIF firstColVal NEQ "">
      <a href='##' value="#firstColVal#"></a>
   </CFIF>
</td>

在Chrome中查看HTML输出，没有内容的单元格显示为：

<td class="secondCol"></td>

当我在Chrome中检查并复制并粘贴它时，我最终得到了这个：

<td class="secondCol">
                                      </td>

InternetExplorer在考虑:empty时忽略了新行和空格，而Chrome和FireFox则没有。这是jQuery 1.7.1。

：空选择器不在某些单元格中具有锚点的列上工作？

2 个答案: