Question

我试图重复使用我创建的对象来动态创建页面上的多个滑块。我的想法是创建一个数组并根据需要经常推送我的滑块对象，所以我可以通过id访问它。不幸的是，它不起作用。希望有人能指出我正确的方向......

所以我拥有的就是这个;

var slider = {
  "init":function(slide_it){
    this.parent = $(slide_it);
    /Count Elements and create a navigation depending on the count etc./
  },
  "otherstuff":{...}
}

在我的（文档）.ready函数中，我创建一个数组并用不同的滑块对象填充它，将Ids添加到手风琴中并调用init函数：

var slide_array = [];
var accordion_sections = $('#accordion > div').length;
for(var i = 0; i < accordion_sections; i++){
  slide_array.push(slider);
  $('#accordion').children('div').eq(i).attr('id', 'slide_it_'+ i);
  slide_array[i].init($('#slide_it_' + i).find('.slider'));
}

然后我有一个按钮，类=＆＃34;下一个＆＃34;我在滑块中调用一个函数

$('.next').click(function(){
  slide_array[0].otherstuff();
});

我的计划是获取.next的父级及其ID，以便我可以使用slide_array[parentID].otherstuff();

但是......当我在for循环中多次调用init函数时，它没有正常工作。

更奇怪的是，某些函数调用似乎有效，其他函数调用无效。我做错了什么？

Answer 1

您可以使用Object.create。

var s1 = Object.create(slider),
    s2 = Object.create(slider);

s1.init(...);
s2.init(...);

如果您从this返回init，则可以链接：

var s1 = Object.create(slider).init(...);

但是在这一点上，我会抛弃对象文字并使用构造函数，因为这是你需要的。

function Slider(slide_it) {
    this.parent = $(slide_it);
}

Slider.prototype = {
    constructor: Slider,
    otherStuff: function () {}
};


var s1 = new Slider(...),
    s2 = new Slider(...);

Answer 2

编写一个函数来返回对象：

function slider() {
  return {
    "init":function(slide_it){
      this.parent = $(slide_it);
      /Count Elements and create a navigation depending on the count etc./
    },
    "otherstuff":{...}
  };
}

然后：

slide_array.push( slider() );

每次都会给你一个单独的对象。在您的版本中，您将使用对同一个对象的引用来填充数组。

Answer 3

为什么不把它变成jQuery plugin？

jQuery.fn.slider = function(options) {
    return this.each(function() {
        var sliderElem = $(this),
            settings   = $.extend({
                speed : 3000,
                something : 'other thing'
            }, options);

        otherStuff(sliderElem);
    });

    function otherStuff(elem) {

    }
}

$('#accordion > div').slider();

没有迭代或跳过箍，只是在集合上调用它并为每个元素创建一个新的滑块？

如何重用对象文字

3 个答案: