如何动态创建多个jQuery滑块？

Question

我正在开发一个WordPress网站，将自定义帖子类型转变为页面上的滑块。我使用Sequence.js我的滑块和我可以手动创建多个滑块具有以下没有问题：

//sequence slider options to be used by slider1 
var options0 = { 
    sartingFrameID: 1, 
    cycle: true, 
    autoPlay: false, 
    nextButton: '.next0', 
    prevButton: '.prev0', 
    fallback: { 
     theme: "fade", 
     speed: 100 
    } 
} 

//slider1 
var sequence0 = $(".slideContainer0").sequence(options0).data("sequence"); 

//sequence slider options to be used by slider2 
var options1 = { 
    sartingFrameID: 1, 
    cycle: true, 
    autoPlay: false, 
    nextButton: '.next1', 
    prevButton: '.prev1', 
    fallback: { 
     theme: "fade", 
     speed: 100 
    } 
} 

//slider2 
var sequence1 = $(".slideContainer1").sequence(options1).data("sequence"); 

我如何可以简化这个？并且使其成为动态的，因此为制作的每个帖子创建一个滑块。任何帮助将不胜感激。

编辑 - 加入工作答案

我通过转动选项输出到一个函数和简单的调用为每个序列实例的计数器中的函数所使用的答案从甲基异丙基苯下面的第一部分。然后使用他的答案的第二部分初始化每个序列滑块，它的工作原理。

这就是我现在的工作：

function options(number) { 
    return { 
     startingFrameID: 1, 
     cycle: true, 
     autoPlay: false, 
     nextButton: '.next' + number, 
     prevButton: '.prev' + number, 
     fallback: { 
      theme: "fade", 
      speed: 100 
     } 
    }; 
} 

var count = 0; 
$('.slideContainer').each(function() { 
    var sequence = $(this); 
    sequence.sequence(options(count)).data('sequence'); 
    count++; 
}); 

Answer 1

我没有使用序列但是从你的文章，我猜你希望能够重新创建选项与数字的增量对象。所以，你可以做这样的事情：

function options(number) { 
    return { 
    startingFrameID: 1, 
    cycle: true, 
    autoPlay: false, 
    nextButton: '.next' + number, 
    prevButton: '.prev' + number, 
    fallback: { 
     theme: "fade", 
     speed: 100 
    } 
    }; 
} 

然后使用它像这样：

$(target).sequence(options(0)).data("sequence"); 

或者在具体的例子：

//slider1 
var sequence0 = $(".slideContainer0").sequence(options(0)).data("sequence"); 

//slider2 
var sequence1 = $(".slideContainer1").sequence(options(1)).data("sequence") 

而且做你正在谈论怎么样关于给予所有序列相同的类如说custom-sequence，然后做这样的事情：

var count = 0; 
$('.custom-sequence').each(function() { 
    var sequence = $(this); 
    sequence.sequence(options(count)).data('sequence'); 
    count++; 
}); 

这可能会也可能不会工作 - 我不清楚.data('sequence')正在做什么。