简单转盘prev/next jquery函数-prev函数不工作

我在下面的转盘中的“PREV”jquery函数中有问题，请帮助

<div id="carousel">
    <div id="product-detail-image-wrapper">
        <div id="product-detail-image-inner-wrapper">
            <img class="product-detail-image" src="images/01.jpg" />
            <img class="product-detail-image" src="images/02.jpg" />
            <img class="product-detail-image" src="images/03.jpg" />
            <img class="product-detail-image" src="images/04.jpg" />
            <img class="product-detail-image" src="images/05.jpg" />
        </div>
        <img id="image-control-left" src="images/left-arrow.png" onclick="showPrev();" />
        <img id="image-control-right" src="images/right-arrow.png" onclick="showNext();" />                         
    </div>
</div>

有人能告诉我showPrev（）函数中的错误是什么吗？我试了很多次，但都没用。非常感谢

在showNext（）函数中，单击“下一步”按钮时，图像“01”将淡出，图像“02”将淡入，然后图像“01”将进入列表的末尾，如下所示：

<div id="product-detail-image-inner-wrapper">
    <img class="product-detail-image" src="images/02.jpg" />
    <img class="product-detail-image" src="images/03.jpg" />
    <img class="product-detail-image" src="images/04.jpg" />
    <img class="product-detail-image" src="images/05.jpg" />
    <img class="product-detail-image" src="images/01.jpg" />
</div>

上面最后4行将设置为“显示：无；”。

---

在showPrev（）函数中，我希望在反向模式中出现相同的行为。

以下是crousel的标准代码和图像

如果打开devtools，您将看到右侧图像未被选中，也未正确移动到第一位

当向后移动时，您需要：淡出第一个图像，找到最后一个图像，淡入并移动到第一个位置

function showPrev() {
  $('#product-detail-image-inner-wrapper :first-child').fadeOut()
    .nextAll('img:last-of-type').fadeIn().end();
  $("#product-detail-image-inner-wrapper :last-child").prependTo('#product-detail-image-inner-wrapper');
}

工作示例：

$（文档）.ready（函数（）{
//隐藏除第一张以外的所有图像。。。
$（“#产品详细信息图像内包装img:gt（0）”.hide（）；
});
函数showNext（）{
$（“#产品详细信息图像内部包装：第一个子项”）.fadeOut（）
.next（'img'）.fadeIn（）
.end（）.appendTo（“#产品详细信息图像内包装”）；
}
函数showPrev（）{
$（“#产品详细信息图像内部包装：第一个子项”）.fadeOut（）
.nextAll（'img:类型的最后一个'）.fadeIn（）.end（）；
$（“#产品详细信息图像内包装：最后一个子项”）.prependTo（“#产品详细信息图像内包装”）；
}

img{
最大宽度：200px；
}

-
+

可能是：.prev（'img'）……谢谢gaetanoM。但这不起作用。为什么不使用crousel组件？谢谢Moti。但是我避免使用额外的JS库，比如Bootstrap。我只使用了一个JS库，那就是JQuery。谁说了关于bootstrap的事情？“Simple carousel prev/next JQuery函数-prev函数不工作”。这是最简单的旋转木马。我避免加载大型库，否则网络中有数千个旋转木马示例，但它们使用大型库，因此我想自己编写一个简单的旋转木马。感谢Moti建议使用引导，但我更喜欢不使用JS库的更简单的引导。感谢ikiK为您提供的简单解决方案-非常感谢。谢谢ikiK。非常感谢。它起作用了。再次感谢。艾萨克NP，请考虑标记答案作为接受。✔︎ 按钮，所以它将问题标记为已为其他人解决。干杯

function showPrev() {
  $('#product-detail-image-inner-wrapper :first-child').fadeOut()
    .nextAll('img:last-of-type').fadeIn().end();
  $("#product-detail-image-inner-wrapper :last-child").prependTo('#product-detail-image-inner-wrapper');
}