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：

＆＃13;

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

＆＃13;

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

＆＃13;

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's attribute selectors？

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

工作example here

Answer 4

您通过attr（）

获取src值的语法错误

更改

if ($(".imagen").attr(src="") == "") {

到的

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

Answer 5

我很惊讶您没有某种语法错误你的代码也是错的，因为它不会测试.imagen的每个实例。

这样做

$(".imagen[src='']").hide();

Answer 6

在样式表中，添加以下代码以定义“隐藏”类：

 .hidden {
    display: none;
}

然后添加以下javascript代码：

$(document).ready(function() {
   $(".imgagen").each(function() {
        var atr = $(this).attr("src"); 
        if(atr == "") {
            $(this).addClass("hidden");
        } else {
            $(this).removeClass("hidden");
        }
    });
});

Answer 7

测试src属性是否为null，但无论如何 - 如果你隐藏图像包装A元素会发生什么？相反，不要为没有任何图像的人生成A / IMG元素。

Answer 8

您发布的代码应该可以使用，但请确保您已在ur html页面的标题上添加了jquery库文件。

转到jquery站点，然后下载js文件。然后在HTML页面部分头部添加以下行：

Answer 9

只需在alt标记内放置空格。这是工作代码

 <img class="imagen" src="" width="800" alt" ">

如果src为空，则隐藏图像

9 个答案: