Javascript 使用JQuery更改多个图像

下面是我使用的JQuery

jQuery(document).ready(function($) {
    $('.ltwitch').each(function () {
        var tnick = $(this).data('tnick');
        var span = $(this).next();
        $.getJSON("https://api.twitch.tv/kraken/streams/"+tnick+".json?callback=?", function(c) {
            if (c.stream == null) {
                span.html("Offline");
            } else {
                span.html("Online");
            }
        });
    });
});

还有我找到它时的HTML

<a class="ltwitch" href="http://www.twitch.tv/ifstudios" data-tnick="IFStudios">IFStudios</a> (<span>...</span>)

（…）

鸡牙（…）

现在我想做的是，我有这样的HTML

<a href="#portfolioModal3" class="portfolio-link" data-toggle="modal">
                    <div class="portfolio-hover">
                        <div class="portfolio-hover-content">
                            <i class="fa fa-plus fa-3x"></i>
                        </div>
                    </div>
                    <img src="img/portfolio/sweet.png" class="img-responsive" alt="">
                </a>

基本上，当一个频道上线时，我想将img src从我设置的图像切换到与-online相同的图像。所以我可以在网站上有多张图片，但我可以根据谁在现场和谁不在现场而改变图片

所以如果我有

                    <a href="#portfolioModal3" class="portfolio-link" data-toggle="modal">
                    <div class="portfolio-hover">
                        <div class="portfolio-hover-content">
                            <i class="fa fa-plus fa-3x"></i>
                        </div>
                    </div>
                    <img src="img/portfolio/sweet.png" class="img-responsive" alt="">
                </a>

当她的频道上线时，它将转到

                    <a href="#portfolioModal3" class="portfolio-link" data-toggle="modal">
                    <div class="portfolio-hover">
                        <div class="portfolio-hover-content">
                            <i class="fa fa-plus fa-3x"></i>
                        </div>
                    </div>
                    <img src="img/portfolio/sweet-online.png" class="img-responsive" alt="">

或者如果是

 <img src="img/portfolio/carrot.png" 

它会变成

 <img src="img/portfolio/carrot-online.png"


有什么想法吗？
试试下面的代码

jQuery(document).ready(function($) {
    $('.ltwitch').each(function () {
        var tnick = $(this).data('tnick');
        var span = $(this).next();
        $.getJSON("https://api.twitch.tv/kraken/streams/"+tnick+".json?callback=?", function(c) {
            var img = $(img-selector);
            var source = img.attr('src');
            if (c.stream != null) {
                // Online
                if(source.indexOf('.png') != -1){
                    source = source.replace(".png", "-online.png");
                    img.attr('src',source);
                }
            }
            else{
                // Offline
                source.replace("-online", "");
                img.attr('src',source);
            }
        });
    });
});

注意：您必须将正确的图像选择器传递给
$（img选择器）
。再次调用相同的函数进行刷新
您的问题是什么？编写一个函数，获取相应元素的
image.src
，将
-online
插入其中，并将其写回
image.src
。基本上，我只希望它检查频道是否在线，并将-online添加到现有映像的末尾，或者在频道检查时返回“null”时将其删除。或者，如果我做不到的话，就为洞设置图像。我知道你想做什么，这不是问题。请展示您尝试实现它的情况，并解释您遇到的问题。然后，我们将尝试帮助您修复它。我刚刚使用基本代码添加了一个状态横幅。我只是不够擅长编码，无法添加图片，我不知道如何调用它。我正在尽我最大的努力：/I如果我弄明白了，我会更新：要添加
-online
，您只需执行
source.replace（“.png”，”-online.png”）（就像您在删除
-联机时所做的那样，无需切片）