Jquery 在组中切换和淡入图像

我有两组图像，命名为以下模式：

橙子1.jpg 橙子2.jpg 橙子3.jpg 橙子4.jpg

Apples1.jpg Apples2.jpg Apples3.jpg Apples4.jpg

在我的页面上，我有一个div，它显示从每个组中选择的图像：

<div>
<img src="Oranges1.jpg"/>
<img src="Oranges2.jpg"/>
<img src="Apples3.jpg"/>
<img src="Apples4.jpg"/>
</div>

我想通过jQuery在两个组之间切换和淡入图像。例如，当页面加载上面的图像时。然后，5秒钟后，图像组切换，使“Oranges1.jpg”变为“Apples1.jpg”，“Apples3.jpg”变为“Oranges3.jpg”等，例如：

因此，每5秒钟，图像会变为相反的组，但具有相应的图像编号

有什么好办法吗

---

谢谢

试试这样的方法：

setTimeout(function() {
$('div img').each(function() {
    if ($(this).prop('src').indexOf('Oranges') != -1)
        $(this).prop('src', $(this).prop('src').replace('Oranges', 'Apples'));

     if ($(this).prop('src').indexOf('Apples') != -1)
        $(this).prop('src', $(this).prop('src').replace('Apples', 'Oranges'));                 
});
}, 5000)

---

评论中的格式不是很好，但两个答案的结合意味着我同意：

setInterval(function(){
    $('div > img').each(function(i){
        this.src = (/apples/g.test(this.src) ? $(this).prop('src').replace('apples', 'oranges') : $(this).prop('src').replace('oranges', 'apples') );
    }); 
}, 5000);

---

谢谢你们两个

setInterval（）

和

.replace（）

将与jquery一起使用。非常好，谢谢。如果URL中存在绝对路径，我最终使用了您和LorDex的示例的混合：setInterval（function（）{$（'div>img'）。每个（function（I）{this.src=（/apples/g.test（this.src）？$（this.prop（'src'）.replace（'apples'，'oranges'）：$（this.prop（'src'）。replace（'oranges'））；}，5000）；谢谢你，请看我对Spokey的回答的评论，因为我最后结合了你的两个例子。

setInterval(function(){
    $('div > img').each(function(i){
        this.src = (/Apples/g.test(this.src) ? 'Oranges' : 'Apples') 
             + (i+1) + '.jpg';
    }); 
}, 5000);

setInterval(function(){
    $('div > img').each(function(i){
        this.src = (/apples/g.test(this.src) ? $(this).prop('src').replace('apples', 'oranges') : $(this).prop('src').replace('oranges', 'apples') );
    }); 
}, 5000);