如果 img src = null 则隐藏父元素 [关闭]答案

【问题标题】：Hide parent element if img src = null [closed]如果 img src = null 则隐藏父元素 [关闭]
【发布时间】：2017-03-01 23:14:47
【问题描述】：

如果 td 内的图像 src 为空，我想隐藏包含图像的 td。

我尝试了以下方法，但它会隐藏的不仅仅是我试图定位的 td：

$('td').each(function() {
    if($(this).find('img').attr('src') == "null"){
        $(this).css('display', 'none');
    }
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr>
      <td>
        <p class="centered">
          <label class="wrapable">
          <img src="null">
          <input name="test" value="1" type="radio">
          </label>
        </p>
      </td>
      <td>
        <p class="centered">
          <label class="wrapable">
          <img src="null">
          <input name="test" value="1" type="radio">
          </label>
        </p>
      </td>
      <td>
        <p class="centered">
          <label class="wrapable">
          <img src="null">
          <input name="test" value="1" type="radio">
          </label>
        </p>
      </td>
      <td>
        <p class="centered">
          <label class="wrapable">
          <img src="http://lorempixel.com/100/100">
          <input name="test" value="1" type="radio">
          </label>
        </p>
      </td>
    </tr>
  <tbody>
</table>

任何帮助将不胜感激，仍在学习:)

【问题讨论】：

你确定它不起作用吗？看起来确实如此。
"它不仅会隐藏我试图定位的 td："。那它还隐藏了什么？在我看来它应该可以工作。
注意可以简化成$('img[src="null"]').closest("td").hide();
此表嵌套在另一个表中，因此它也隐藏了包含的 td。
然后使用 Denys 的建议；另外：为什么问题中没有那个细节？您能否edit 将其包含在内，因为它肯定与问题相关。

标签： javascript jquery

【解决方案1】：

使用jQuery最简单的解决方案：

$('td:has(img[src="null"])').hide();

或稍快：

$('td').has('img[src="null"]').hide();

【讨论】：

您能否详细说明为什么第二个版本应该更快？
@garglblarg 它使用原生的querySelectorAll 方法来查找td，而不是原生不支持的自定义:has() 选择器。

【解决方案2】：

应该是这样的短线：$('img[src="null"]').parents('td:first').hide();

如果需要定位所有父 td 祖先 $('img[src="null"]').parents('td').hide(); 删除伪 :first 选择器，

【讨论】：

parents，而不是parent。为您修复。
嗨 niutech 它应该是 'parent' 以隐藏正确和直接的母亲 td，'parents' 将隐藏拥有这个 img 的每个 td 元素。如果整个表都在“td”内，则将隐藏整个表，这似乎不是这个问题的意图。会换回父母。
在上面提供的代码中，<img src="null"> 在<label> 内部，而不是<td> 和parent() 看起来只在DOM 上一层。
嗨，niutech，我确认你是对的，无论如何，如果使用“父母”，必须使用 :first 伪选择器，以便仅隐藏直接的 td 父母。

【解决方案3】：

你也可以试试这个

<img onerror="this.parent.style.display='none'" src=".." />

【讨论】：