javascript - 检查类是否包含img src，如果不包含，则隐藏它。 jQuery

Question

我有一个预设的7个图像持有者div，我向php发送请求以检索用户的作品，所以假设如果有3个作品并且我添加到3个img持有者，我将有4个空图像div，我不知道如何检查以隐藏其余部分。

HTML

<div class="portfolio_thumb">
   <div class="portfolio_thumbImg_holder columns"><img src=""></div>
   <div class="portfolio_thumbImg_holder active columns"><img src=""></div>
   <div class="portfolio_thumbImg_holder columns"><img src=""></div>
   <div class="portfolio_thumbImg_holder columns"><img src=""></div>
   <div class="portfolio_thumbImg_holder columns"><img src=""></div>
   <div class="portfolio_thumbImg_holder columns"><img src=""></div>
   <div class="portfolio_thumbImg_holder columns"><img src=""></div>
</div>

Jquery

$('.portfolio_thumbImg_holder img').each(function(index, element) { 

    linksArray.push("http://localhost/testdatabase/cms/" + data[index].links);
    $(element).attr("src", linksArray[index]);
    titleArray.push(data[index].title);
    $(element).attr("title", titleArray[index]);
    descArray.push(data[index].desc);
    $(element).attr("desc", descArray[index]);
    alert("index:"+index + " " + linksArray[index] + " " + titleArray[index] + " " + descArray[index]);
}); 

如何改进 jquery 代码以隐藏所有其他未加载图像的 div？

代码运行后，我的

<div class="portfolio_thumbImg_holder columns"><img src=""></div>

变成

<div class="portfolio_thumbImg_holder columns"><img></div>

所以我不能使用

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

更新:

@jackDuong 提供了我需要的代码

$(".portfolio_thumbImg_holder img:not([src])").parent().hide();

但是在我当前的代码上实现后，$.each函数之后的所有代码都将无法运行，知道为什么吗？

$.ajax({
            type: "POST",
            dataType: "json",
            data: ({id: idArray[index]}), // pass the name of clicked holder into php to query
            url: "CMS/PHP/retrieveAuthorWorks.php",
            success: function(data) {   
                // reset all the arrays value to store new values upon new click
                $('.portfolio_thumbImg_holder img').removeAttr("src");
                linksArray=[];  
                titleArray=[];  
                descArray=[];   
                $(".full_image_desc .title").html(data[0].title);
                $(".full_image_desc .info").html(data[0].desc);

                $('.portfolio_thumbImg_holder img').each(function(index, element) {                                                     
                    linksArray.push("http://localhost/testdatabase/cms/" + data[index].links);
                    $(element).attr("src", linksArray[index]);
                    titleArray.push(data[index].title);
                    $(element).attr("title", titleArray[index]);
                    descArray.push(data[index].desc);
                    $(element).attr("desc", descArray[index]);
                    //$(".portfolio_thumbImg_holder img:not([src])").parent().hide();
                }); 
                // from here onwards code won't run
                alert("hi");
                $(".portfolio_thumbImg_holder img:not([src])").parent().hide();
            }
        });

Answer 1

我明白了...您向“portfolio_thumb”添加了 7 棵榆树。

就这样做:

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

如果你想隐藏div(父级)只要这样做:

$(".portfolio_thumbImg_holder img[src='']").parent().hide();

试试这个例子: http://jsfiddle.net/duongtuanluc/2ktwa75e/

我看到你改变了问题。

如果标签img没有属性src只要这样做:

$(".portfolio_thumbImg_holder img:not([src])").parent().hide();

试试这个例子 http://jsfiddle.net/duongtuanluc/2ktwa75e/