Question

我知道这是stackoverflow中的一个老问题。但对我来说这是新的，我已经找到了解决方案，但我没有得到一个我能理解的解决方案。我有一个插件，因为我有一些功能。现在我想在select options上的事件发生变化时访问其中一个函数。但我的问题是我无法从插件外部访问该功能。但是我是插件开发的新手。

这是我的插件：

    (function($, window, document, undefined) {
    var Spec = {
        init: function(options, ele) 
        {
            var self = this;
            self.elem = ele;
            self.$elem = $(ele);

            self.findPro = (typeof options === 'string') ? self.findPro = options : self.findPro = options.findPro;
            self.options = $.extend({}, $.fn.specpro.options, options);
            if (self.options.findPro === 'latest') {
                self.latestPro();
            }
        },
        latestPro:function(){
            var results=['x','y','z','zx'];
var pinSelector = $('<select/>').addClass('form-control chzn-select  chzn-rtl').attr({'data-placeholder': 'Add pins to filter',
                'multiple': true, 'id': 'pinSelector'}).append($('<option/>').attr('value', ''));
   $.each(results,function(i,item){
       pinSelector.append($('<option/>').attr('value',item).text(item));
   });

pinSelectorCt = $('<div/>').addClass('col-lg-12').append(pinSelector);
    $('#lp').append(pinSelectorCt);
$(".chzn-select").chosen();

        },
        filter:function(filFor){
            this.html('zzz');

        }
    };
    $.fn.specpro = function(options) {
        return this.each(function() {
            var spec = Object.create(Spec);
            spec.init(options, this);
        });
    };
    $.fn.specpro.options = {
        findPro: 'latest'
    };
})(jQuery, window, document);

我尝试的是：

$(function(){
 var mn=$('#lp').specpro({findPro:'latest'});
 $('.chzn-select').chosen().change().mn.filter('latest');
});

任何人都可以告诉我。如何从插件外部调用函数filter。

直播Fiddle

Answer 1

一个简单的解决方案是公开插件实例本身，如

$.fn.specpro = function (options) {
    return this.each(function () {
        var spec = Object.create(Spec);
        spec.init(options, this);
        $(this).data('specpro', spec)
    });
};

然后

var specpro = $('#lp').data('specpro');
specpro.filter();//call which ever method you want

演示：Fiddle

如何从该插件外部调用插件的方法（函数）

1 个答案: