Jquery 避免重复以使旋转木马充满活力

我使用Slider Pro插件，我希望动态化我的jquery代码，使我能够添加幻灯片，而无需每次添加新的代码行，我可以得到一些帮助吗

在我编写的代码中，每个“item-”都允许在鼠标上滑动，但有点重复

$(".item-0").mouseover(function() {
    $('#carousel').sliderPro('gotoSlide', 0);
});
$(".item-1").mouseover(function() {
    $('#carousel').sliderPro('gotoSlide', 1);
});
$(".item-2").mouseover(function() {
    $('#carousel').sliderPro('gotoSlide', 2);
});
$(".item-3").mouseover(function() {
    $('#carousel').sliderPro('gotoSlide', 3);
});
$(".item-4").mouseover(function() {
    $('#carousel').sliderPro('gotoSlide', 4);
});
$(".item-5").mouseover(function() {
    $('#carousel').sliderPro('gotoSlide', 5);
});
$(".item-6").mouseover(function() {
    $('#carousel').sliderPro('gotoSlide', 6);
});

---

尝试使用for循环，缓存DOM元素

var$carousel=$（“#carousel”）也是一种很好的做法如果您多次使用它：

var itemNumber = 6; //number of items
var $carousel = $('#carousel');

for(var i = 0; i <= itemNumber; i++)
{

    $(".item-" + i).mouseover(function() {
        $carousel.sliderPro('gotoSlide', i);
    });

}

var itemNumber=6//项目数
变量$carousel=$（“#carousel”）；
对于（var i=0；i