如何让jQuery滑块适用于生成的ID？

Question

I have created auto generated ids such as

gallary-item-0, gallery-item-1, gallery-item-1

and so on with PHP. How to configure jQuery to start a slider for each id. Here is the code I wrote but it works only for the first ID.

var i = 0;
sleepTime = setInterval(function () {
    var id = $(this).attr("id");           
    $('#gallery-item-'+i).ionImageSlider({
         slideWidth: 150,
         minSlides: 2,
         maxSlides: 10,
         moveSlides: 1,
         slideMargin: 50,
         pager: false
    });
    i++; 
    clearInterval(sleepTime);
}, 3000);
});

Answer 1

Don't call clearInterval(sleepTime) where you are calling it, because it will only fire once, like setTimeout.

Create a variable that has the count of all items with an id starting with gallery-item, and then call clearInterval in your handler when the count is reached.

var i = 0, 
total = $('[id^="gallery-item-"]').length,
sleepTime = setInterval(function () {
    $('#gallery-item-'+ i).ionImageSlider({
         slideWidth: 150,
         minSlides: 2,
         maxSlides: 10,
         moveSlides: 1,
         slideMargin: 50,
         pager: false
    });
    i++; 
    if (i == total - 1) {
        clearInterval(sleepTime);
    }     
}, 3000);