jQuery OOP元素參數

我想用oop創建一個jQuery滑塊。這是我的代碼的結構：jQuery OOP元素參數

var photoGallery = new Slider(); 

function Slider(){ this.init(); } 

Slider.prototype = { 
    el : { 
    nav : $('.slideshowNav', this.main), 
    navItems : $('.items', this.nav), 
    main : $('.slideshow') 
    } 
    ,init: function(){ 
    // some code here 
    }//init 

    // rest of functions here 
}

我的問題是，我有相同的網頁在兩次<div class="slideshow">和我的代碼，根據這個情況是錯誤的。

我知道我可以傳遞一個參數到init()，我的所有問題都會飛走，但我在其他函數中也使用了this.el元素，所以這不是一個解決方案。

我想知道我怎麼可以添加另一個元素this.el從Slider()參數來（我知道，有沒有參數現在）

或者，是否有人有一個想法如何，我可以做，它看起來像結構

$('.slideshow').each(...)

？

我需要我的代碼以多種元素在一個頁面上工作

來源

2013-05-25 stefanz

你想要多個'Slider'實例，一個用於頁面上的每個元素，還是一個用於所有元素的實例？ – migg

將方法和變量移出原型並移入構造函數，如果您需要它們針對各個實例不同。 – nnnnnn

我想要多個滑塊實例:)。感謝您以簡單的方式翻譯我的問題:) – stefanz

這裏是多少jquery plugins開始：

$.fn.myplugin = function(opts) { 
    // Let each closure has its own options 
    var myplugin = new Myplugin(opts); 
    return this.each(myplugin); 
}; 

function Myplugin(opts) {}

通過這種方式，人們可以打電話給你這樣的代碼：

$('.slideshow').myplugin();

，每個元素將被另案處理。在您的每個實例中都可以輕鬆調用this.el，而不會出現任何問題。

來源

2013-05-25 13:33:12

你可以嘗試這樣的事情（未經測試）：

var galleries = []; 

$('.slideshow').each(function(index, elem) { 
    galleries.push(new Slider(elem)); 
});

，然後改變你的Slider實施這樣的事情：

function Slider(elem) { 
    this.elem = elem; 
    this.init(); 
} 

Slider.prototype = { 
    el : { 
     nav : $('.slideshowNav', this.main), 
     navItems : $('.items', this.nav), 
     main : $('.slideshow') 
    } 
    ,init: function() { 
     // some code here 
    }//init 

    // rest of functions here 
}

這種方法的新事物是，你有一個this.elem在你的Slider insta你可以參考。您必須修改一些代碼才能使Slider原型中的this.elem工作，但這會讓您開始工作。

來源

2013-05-25 13:20:26 migg

這是我試過的，但我想用this.elem進入'el'對象 – stefanz

你是什麼意思「使用this.elem進入el對象」？ – migg

我需要像'el這樣的東西：el：{main：this.elem， nav：$（'。slideshowNav'，this.main）}' – stefanz

jQuery OOP元素參數

回答

相關問題