0

我正在尝试编写一个简单的 jquery 插件，但下面的代码变得庞大而混乱，这是解释我试图实现的想法的一部分。

(function( $ ) {


 $.fn.pageBuilder = function( options ) {

    var lb = $.extend({

        self:                   this,
        modal_edit:             $("#vz_edit_modal"),
        modal_delete:           $("#vz_delete_modal"),
        onSlideElements:        function() {},
        onInsertElement:        function() {},
        onSaveElement:          function() {},

    }, options);


    // Disabling all link clicks default action within page layout builder
    this.on( 'click', 'a', function(event) {
        event.preventDefault();
    });


    // Changing class of layout builder elements while dragging for cursor change purposes
    this.on('mousedown', '.element .inner', function(){
        $(this).addClass('grabbing');
    }).on('mouseup', '.element .inner', function(){
        $(this).removeClass('grabbing');
    });     
 };

}( jQuery ));

所以这段代码是插件的核心，想保留在 jquery.myplugin.js 中，现在当我尝试创建一个新文件 jquery.myplugin.elements.js 并添加这段代码时：

(function( $ ){

 $.extend($.fn, {

    pageBuilder: function( options ){ 

        // Extended action
        this.find(".element a").on('click', function() {
            console.log( lb.modal_edit ); // Access to core plugin option
        });
    }

 });

})( jQuery );

问题是我无法让扩展插件工作，this.find(".element a").on('click', function() { 不起作用，我的意思是 console.log 永远不会被触发天气可以'无法访问 lb.modal_edit 或以错误的方式扩展...

另外我需要两个功能来工作核心插件和扩展插件，扩展插件不应该停用核心功能..

提前致谢。

4

1 回答 1

0

您可以采取两种方法。首先，您可以将另一个选项传递给您的核心插件，以允许您执行回调函数。

第二种方法是扩展核心插件的原型。像这样：

$.fn.pageBuilder.prototype.newFunction = function() {};

至于 lb 变量，要访问它，您需要在核心插件中公开它，因为它是一个内部变量。

this.lb = lb;

（不确定这是否会完全按原样工作，但您需要以某种方式公开它。）

于 2013-08-23T13:09:59.860 回答