如果包含文本，请选择元素

Question

我无法让这个工作，我找不到任何类似的问题来做我想要的。

我有一个包含如下行的表：

<div class="gui-table">
          <table>
             <tr>
                <td></td>
                <td></td>
                <td></td>
              </tr>
              <tr>
                <td></td>
                <td><p class="customfields">Size</p></td>
                <td></td>
              </tr>
           //etc... 

我想检查所有第二个单元格中是否都有文本"大小"！如果是这样，则隐藏第三个td。

所以我认为可行的是这样的：

 $('.gui-table tr').each(function(){
  if ($('td:nth-child(2) .customfields:contains("Size")').length > 0) {
     $(this).css('visibillity', 'hidden');
   }
 });

这不行！有人看到这有什么问题吗？

Answer 1

只需执行以下操作：

$('.gui-table .customfields:contains("Size")').css('visibility', 'hidden');

小提琴：http://jsfiddle.net/cfmrngcc/2/

Answer 2

假设我正确理解了您的问题，以下内容应该可以做到：

$('.gui-table p.customfields:contains("Size")').parent().next().hide();

td { border: 1px solid black; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="gui-table">
  <table>
    <tr>
      <td></td>
      <td></td>
      <td>Shown</td>
    </tr>
    <tr>
      <td></td>
      <td><p class="customfields">Size</p></td>
      <td>Hidden</td>
    </tr>
  </table>
  </div>

这将隐藏包含带有文本大小的 p 标签的任何表格单元格之后的下一个表格单元格。

它的工作原理是在 gui-table 内找到包含大小的 P 标签 - $('.gui-table p.customfields:contains("Size")')

然后使用 .parent(( 选择它的父表单元格。

最后 .next(( 和 .hide(( 选择下一个表格单元格并将其隐藏。

Answer 3

我在这个问题上喋喋不休，想出了这个JSFiddle，应该让你再次开始。 基本功能与您开始时非常相似，但修改如下：

    function doItNow(e)
    {
        $('.gui-table tr').each(function ()
        {
            $('td:nth-child(2) .customfields:contains("Size")').each(function ()
            {
                $(this).parents('tr').children('td:nth-child(3)').css('visibility', 'hidden');
            });
        });
    }

请注意，内部 each(( 传递的是段落元素而不是单元格元素。 所以我遍历了 parents(( 链，直到找到那行并隐藏了第三个孩子。 你也许可以在没有内部的情况下编写这个代码，但我懒得那么复杂！

Answer 4

如果您只想隐藏第三列，当第二列中有"size"一词时，您可以通过以下方式执行此操作：

$('.gui-table td:nth-child(2):contains("Size")').next().css('visibility', 'hidden');

这是一个jsfiddle：http://jsfiddle.net/0qczvak5/

解释：

选择所有类名为.gui-table的元素，选择所有带td:nth-child(2)秒td，用:contains("Size")过滤。现在，您拥有带有"Size"一词的所有第二td，并且.next()得到以下单元格(第三个单元格(，并用.css('visibility', 'hidden')隐藏它。

Answer 5

$(".gui-table tr td:nth-child(2)").each(
    function (index,tag){  
        if ($(tag).find("p").text() == "Size") 
        $(tag).css('visibility', 'hidden');
   }
 )

这是将工作.