如何从该插件外部调用插件的方法(函数)



我知道这是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

活小提琴

一个简单的解决方案是像

一样公开插件实例
$.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

演示:小提琴

最新更新