JQuery插件類不工作

我正在開發一個JQuery插件。我需要在我的插件中使用OOP。但是，班級沒有像我期望的那樣工作。當我啓動該類的新實例時，它只是其正在執行的代碼的第一行。這段代碼有什麼問題，以及如何在啓動時執行這個類的構造函數？JQuery插件類不工作

(function ($) { 
    var FunClass; 

    FunClass = function() { 
    console.log("FunGlobal"); 

    function FunClass() { 
     console.log("FunConstructor"); 
    } 

    FunClass.prototype.letsFun = function() { 
     console.log("FunMethod"); 
    } 
    }(); 

    $.fn.fun = function() { 
    var funClass; 

    return this.each(function() { 
     funClass = new FunClass(); 
     funClass.letsFun(); 
    }); 
    }; 
}(jQuery));

這裏是控制檯輸出：Console Output

感謝您的幫助。

來源

2017-01-29 BigSant

你如何啓動類的新實例？ –

讓我們在這裏清楚，你沒有一個類 - 你有一個函數，這是一個對象。對象的所有方法都應該在函數的原型上聲明，而不是寫入構造函數本身的主體中。 –

我以這段代碼爲例：[link]（https://github.com/ludo/jquery-treetable/blob/master/jquery.treetable.js）。有使用這種方法（節點和樹）。正如你所說@ScottMarcus我應該在原型上聲明所有方法？那麼我應該如何爲這個類調用構造函數？ – BigSant

看來你已經忘記返回FunClass：

(function($) { 
 
    var FunClass; 
 

 
    FunClass = (function() { 
 
    console.log("FunGlobal"); 
 

 
    function FunClass() { 
 
     console.log("FunConstructor"); 
 
    } 
 

 
    FunClass.prototype.letsFun = function() { 
 
     console.log("FunMethod"); 
 
    } 
 
    return FunClass; // you missed this line 
 
    })(); 
 

 
    $.fn.fun = function() { 
 
    var funClass; 
 

 
    return this.each(function() { 
 
     funClass = new FunClass(); 
 
     funClass.letsFun(); 
 
    }); 
 
    }; 
 
}(jQuery)); 
 

 
// Usage 
 
$(function() { 
 
    $('body').fun(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

來源

2017-01-29 21:52:37 dNitro

非常感謝。這樣可行！ – BigSant

JQuery插件類不工作

回答

相關問題