jQuery - 如果 img src 没有图像路径，则隐藏父级答案

【问题标题】：jQuery - hide parent if img src has no image pathjQuery - 如果 img src 没有图像路径，则隐藏父级
【发布时间】：2023-03-15 17:15:02
【问题描述】：

我在页面上有一个 OL，每个 LI 都包含一个 img 标签。但是，其中一些 img src 属性仅包含缩略图生成器代码，但没有图像路径。我需要为每个这样的 img 隐藏父 LI。

我的 HTML：

<ol class="flex-control-thumbs">
<li><img src="graphic.jpg?action=thumbnail"></li>
<li><img src="?action=thumbnail"></li>
<li><img src="graphic.jpg?action=thumbnail"></li>
</ol>

如果不是动作变量，我可以检查长度：

$(".flex-control-thumbs li").each(function () {
    var self = $(this);
    if (self.find('img[src=""]').text().length > 62) {
        self.hide();
    }
});

所以我在想，为了适应 action 变量，我要么需要检查总 src 长度是否大于 x 个字符，要么我需要找到我知道将始终在 src 中的某些字符 IF an存在图像路径，例如“.jpg”。我不知道如何让这两种方法发挥作用。

【问题讨论】：

首先我建议解决问题的原因，参考损坏，而不是治愈症状。
接下来，如果您真的不能这样做（为什么不呢？）那么我会使用一些 url 解析器以确保不会错过解释引用。
你可以试试这个$('img:not([src*="."])').parent().hide()。这将找到所有在其 src 中没有句点的 img，然后选择该父级并将其隐藏。
我同意@arkascha 先生的观点。修改 src 属性生成代码。为了快速修复@Pedro Estrada 的代码看起来像解决方案。但是，如果页面上有许多此类损坏的 img 标签，最好为选择器 .flex-control-thumbs img:not([src*="."]) 添加父 OL 类。或者有机会隐藏重要的事情。
我无法控制 OL 的输出，但 Pedro 和 Barada 的反应就像一个魅力（我确实使用了 Barada 的附加建议）。如果有人作为答案发布，很高兴将其标记为正确。谢谢！

标签： jquery

【解决方案1】：

您可以在img 标签上使用onerror 事件：

<ol class="flex-control-thumbs">
    <li><img src="graphic.jpg?action=thumbnail" onerror="hideParent()"></li>
    ...
</ol>

JS：

function hideParent() {
    $(this).parent().hide();
}

【讨论】：

无论如何，请求都会被完成......你会看到一闪而过的风格。