如果src为空,则隐藏图像

Question

<img>如果源是空的,我试图隐藏.但我没有运气.

我在这里发现了一些帖子,但它对我不起作用.

这是我的代码,它是基于表的,因为它将是一个模板:图像:

<td width="92%" align="center" class="imagenes_desc">
        <a href="#" class="showcase"><img class="imagen" src="http://webs.ono.com/norfolk/ebay/images/01.jpg" width="800"></a>
        <a href="#" class="showcase"><img class="imagen" src="" width="800"></a>
        <a href="#" class="showcase"><img class="imagen" src="" width="800"></a>
        <a href="#" class="showcase"><img class="imagen" src="" width="800"></a>
        <a href="#" class="showcase"><img class="imagen" src="" width="800"></a>
        <a href="#" class="showcase"><img class="imagen" src="" width="800"></a>
        <a href="#" class="showcase"><img class="imagen" src="" width="800"></a>
        <a href="#" class="showcase"><img class="imagen" src="" width="800"></a>
        <a href="#" class="showcase"><img class="imagen" src="" width="800"></a>
        <a href="#" class="showcase"><img class="imagen" src="" width="800"></a>
        </td>

这是我正在尝试实现的Javascript.

<script type="text/javascript">
        $(document).ready(function(){
            if ($(".imagen").attr(src="") == "") {
                $(".imagen").hide();
            }
            else {
                $(".imagen").show();
            }
</script>

我对JS不是很熟悉,我在Stackoverflow上找到了这个脚本,但我无法让它工作.

更新

尝试这个,但不起作用(Chrome隐藏得很好,但Firefox和IE却没有):

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>
<script type="text/javascript">
$("imagen").each(function(){

  if ($(this).attr("src") == "") 
       $(this).hide();
  else

      $(this).show();
});
</script>
<style>
.hide {display:none !important;}
.show {display:block !important;}
</style>

谢谢,

Answer 1

您可以使用CSS:

img[src=""] {
    display: none;
}

<img src="">
<img src="http://dreamatico.com/data_images/kitten/kitten-2.jpg">

Answer 2

你的逻辑是有缺陷的.

if ($(".imagen").attr(src="") == "") {
  $(".imagen").hide();
}
else {
  $(".imagen").show();
}

这不起作用,因为你已遍历每个实例 .imagen

$('.imagen').show().filter(function(){
  return $(this).attr('src') == '';
}).parents('a').hide();

在上面,我们显示所有.imagen的,然后根据它们的src属性进行过滤,然后隐藏我们剩下的那个.

作为侧点,您可能希望隐藏父<a>元素,而不是图像.

Answer 3

如何使用jQuery 的属性选择器？

    $(document).ready(function(){
        $('.imagen[src=""]').hide();
        $('.imagen:not([src=""])').show();
    });

这里的工作示例