0

我想使用 JQuery 来检查图像是否可用，如果没有，则将其包含的 div 设置为 display:none，并将同一部分中的不同 div 设置为 display:inline。

我不是 javascript 的专家，我知道这段代码是错误的，但你能建议修复吗？

这是我的 HTML 和 CSS 以及我目前拥有的 JQuery 的示例：

HTML：

<div class="content" >
    <div class="image"> <img src="images/IMG_0711a.JPG" alt="image"> </div>
    <div class="noimage"> </div>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>

<div class="content" >
    <div class="image"> <img src="" alt="no image src"> </div>
    <div class="noimage"> </div>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>

<div class="content" >
    <div class="image"> <img src="images/IMG_0711a.JPG" alt="image"> </div>
    <div class="noimage"> </div>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>

CSS：

.noimage    {display:none;}

查询：

$(".content").each(function()       //for each class 'content'
    {      
    var $selection = $(this);
    if ($('.content .image img').attr('src') == '')    //if inner div called 'image' has image url equal to null
        {
        $".content .image".remove();            //hide the inner div 'image'
        $".content .noimage".show();            //show the inner div 'noimage'
        $".content .noimage".text("my text");   //add text to inner div 'noimage'
        }
    }
4

1 回答 1

1

尝试

$(".content").each(function()  {      
    var $selection = $(this);
    if (!$('img', $selection).attr('src')) {
        $(".image", $selection).remove();            //hide the inner div 'image'
        $(".noimage", $selection).show().text("my text");            //show the inner div 'noimage'
    }
})

演示：小提琴

于 2013-04-30T10:21:26.103 回答