1

我有这个轮播功能:

if ($.browser.msie && $.browser.version.substr(0,1)<9) {
$("ul.display li:eq(0))").show();
}
else
{
$("ul.display li:first").show();
}

$(".viewer ul li.img:first").addClass('viewerOn');

function prodCarousel(){
var aSpecimen = 0;

    $('li.next a').click(function() {
        $('ul.display li').hide();
        $('.viewer ul li.img').siblings().removeClass('viewerOn');
        aSpecimen = aSpecimen + 1;

        if (aSpecimen == $('ul.display li').length + 0)
            aSpecimen = 0;

        if (aSpecimen == $('.viewer ul li.img').length + 0)
            aSpecimen = 0;

        $('ul.display li:eq(' + aSpecimen + ')').fadeIn("fast");

        $('.viewer ul li.img:eq(' + aSpecimen + ')').addClass('viewerOn');

        return false;
    });

    $('li.prev a').click(function() {
        $('ul.display li').hide();
        $('.viewer ul li.img').siblings().removeClass('viewerOn');
        aSpecimen = aSpecimen - 1;

         if (aSpecimen == -1) aSpecimen = $('ul.display li').length - 1;

        $('ul.display li:eq(' + aSpecimen + ')').fadeIn("fast");
        $('.viewer ul li.img:eq(' + aSpecimen + ')').addClass('viewerOn');
        return false;
    });

}

它工作得很好,但由于我在页面上有多个使用类.dispaly的 div ,因此该函数循环浏览页面上的所有图像。

我想要的是该功能仅循环浏览父 div 中的照片。

我不知道该怎么做?

4

1 回答 1

1

您正在引用ul.display,这意味着您在该类的页面上是否有任何 div 并不重要。

假设您的意思是您<ul>的类有多个 ' ,并且 prev 和 next 按钮与您希望操作.display的容器位于同一个容器内,您可以在 click 事件上引用该父级:<ul>

$('li.next a').click(function() {
    $(this).parent().parent().parent().find('ul.display li').hide();
    ... etc
});

第一个parent()引用li.next,第二个parent()引用<ul>包含li.next,第三个parent()引用<ul>的容器,可能是一个 div,ul.display如果你设置你的 DOM 来支持这种关系,它也可以很容易地包含 。

于 2011-07-21T18:39:56.413 回答