隐藏或删除使用 javascript 或 jquery 找不到的图像

Question

我可以隐藏、跳转或删除在 balise 中找不到的图像吗

<a href="..."> 

和

<img src="...">

我已经使用了：

$("img").error(function(){ $(this).hide(); });

未找到的图像是隐藏的，但是当我在我的画廊中时，我可以看到一个白色的屏幕。

这是我的画廊示例

<a class="fancyboxgallery" rel="book" href="http://www.booclin.ovh/tom/2/index/photos/projet/6.jpg" title="">
<img class="fancyboxthumbnailsgallery" src="http://www.booclin.ovh/tom/2/index/photos/projet/06.jpg" alt=""/>
</a>

<a class="fancyboxgallery" rel="book" href="http://www.booclin.ovh/tom/2/index/photos/projet/5.jpg" title="">
<img class="fancyboxthumbnailsgallery" src="http://www.booclin.ovh/tom/2/index/photos/projet/05.jpg" alt=""/>
</a>

<a class="fancyboxgallery" rel="book" href="http://www.booclin.ovh/tom/2/index/photos/projet/4.jpg" title="">
<img class="fancyboxthumbnailsgallery" src="http://www.booclin.ovh/tom/2/index/photos/projet/04.jpg" alt=""/>
</a>

<a class="fancyboxgallery" rel="book" href="http://www.booclin.ovh/tom/2/index/photos/projet/3.jpg" title="">
<img class="fancyboxthumbnailsgallery" src="http://www.booclin.ovh/tom/2/index/photos/projet/03.jpg" alt=""/>
</a>

<a class="fancyboxgallery" rel="book" href="http://www.booclin.ovh/tom/2/index/photos/projet/2.jpg" title="">
<img class="fancyboxthumbnailsgallery" src="http://www.booclin.ovh/tom/2/index/photos/projet/02.jpg" alt=""/>
</a>


<a class="fancyboxgallery" rel="book" href="http://www.booclin.ovh/tom/2/index/photos/projet/1.jpg" title="">
<img class="fancyboxthumbnailsgallery" src="http://www.booclin.ovh/tom/2/index/photos/projet/01.jpg" alt=""/>
</a>

Answer 1

如何删除a :-

 $("img").error(function() { $(this).parent().remove(); }); $("a.fancyboxgallery").fancybox();

 <link href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.css" rel="stylesheet" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.js"></script> <a class="fancyboxgallery" rel="book" href="http://www.booclin.ovh/tom/2/index/photos/projet/6.jpg" title=""> <img class="fancyboxthumbnailsgallery" src="http://www.booclin.ovh/tom/2/index/photos/projet/06.jpg" alt="" /> </a> <a class="fancyboxgallery" rel="book" href="http://www.booclin.ovh/tom/2/index/photos/projet/5.jpg" title=""> <img class="fancyboxthumbnailsgallery" src="http://www.booclin.ovh/tom/2/index/photos/projet/05.jpg" alt="" /> </a> <a class="fancyboxgallery" rel="book" href="http://www.booclin.ovh/tom/2/index/photos/projet/4.jpg" title=""> <img class="fancyboxthumbnailsgallery" src="http://www.booclin.ovh/tom/2/index/photos/projet/04.jpg" alt="" /> </a> <a class="fancyboxgallery" rel="book" href="http://www.booclin.ovh/tom/2/index/photos/projet/3.jpg" title=""> <img class="fancyboxthumbnailsgallery" src="http://www.booclin.ovh/tom/2/index/photos/projet/03.jpg" alt="" /> </a> <a class="fancyboxgallery" rel="book" href="http://www.booclin.ovh/tom/2/index/photos/projet/2.jpg" title=""> <img class="fancyboxthumbnailsgallery" src="http://www.booclin.ovh/tom/2/index/photos/projet/02.jpg" alt="" /> </a> <a class="fancyboxgallery" rel="book" href="http://www.booclin.ovh/tom/2/index/photos/projet/1.jpg" title=""> <img class="fancyboxthumbnailsgallery" src="http://www.booclin.ovh/tom/2/index/photos/projet/01.jpg" alt="" /> </a>

Answer 2

我的猜测是空的空间来自空的a标签，所以你可能想要选择父标签。 所以而不是$(this).hide(); 试试$(this).parent().hide(); .

此外，通过使用此方法，您可能需要一个比$('img')更具体的选择器。 所以也许试试$('.fancyboxthumbnailsgallery').error(function(){ $(this).parent().hide(); }); .

要隐藏所有图像，我会检查类并以不同的方式处理隐藏，如下所示：

$('img').error(function(){
    if($(this).hasClass('fancyboxthumbnailsgallery')){
        $(this).parent().hide();
    } else {
        $(this).hide();
    }
});

jQuery().父()