Question

我有一些jQuery使用BX滑块为未知数量的画廊创建幻灯片。标记由PHP CMS输出，因此我们无法确信页面上需要的图库数量。

$(function () {

    // Use a class rather than an ID
    var $slider = $('.gallery');

    // For each result
    $slider.each(function (index, element) {

        // If there is more than 1 image
        if ($(element).find('img').length > 1) {

            // Initialise a slider using the current index value
            $slider.eq(index).bxSlider({
                auto: false,
                pager: false,
                duration: 500
            });

        }

    });

});

为了使用公共函数，我需要将BX滑块的每个实例定义为变量。

所以var slider = $('#gallery').bxSlider();将成为常态。如何在每个语句中动态生成这些变量？

Answer 1

你在找这样的东西吗？

$(function () {

    var bxSliderInstances = {};

    // Use a class rather than an ID
    var $slider = $('.gallery');

    // For each result
    $slider.each(function (index, element) {

        // If there is more than 1 image
        if ($(element).find('img').length > 1) {

            // Initialise a slider using the current index value
            bxSliderInstances["slider" + index] = $slider.eq(index).bxSlider({
                auto: false,
                pager: false,
                duration: 500
            });

        }

    });

});

bxSliderInstances将包含所有滑块实例作为关联数组，您可以根据需要使用它。

E.g bxSliderInstances.slider1或`bxSliderInstances["slider1"]将为您提供第一个bxSlider个实例。

将变量附加到.each（）语句中生成的每个BX滑块实例

1 个答案: