Question

我想知道是否有办法为jQuery插件定义变量并让它可以从外部查看。（用于调试目的）

我希望这个插件可能在多个DOM元素上调用，所以我的想法是每次调用都会保留自己的一组变量。

我希望像Firebug一样检查变量的值：

$('#hp-feat-promo').featuredPromo.moduleValues.totalNumSlides

但这不起作用。任何想法如何运作，或者我的理解是错误的？

(function($){
$.fn.featuredPromo = function (options) {

    /* Inside a jQuery plugin this refers to the jQuery object
     * Inside of the nested function declarations, this refers to the local object, so if 
     * you still want to refer to the original DOM object, you need to hhave a pointer to the top-level this 
     */
    var self = this;

    /* Create some defaults, extending them with any options that were provided */
    var defaults = {
        targetElement: self.find('.window ul li'),
        isAuto: true
    },
    settings = '';

    /* settings is all the configurable parameters, defaults + options (overrides) */
    settings = $.extend(defaults, options);

    this.moduleValues = {
        totalNumSlides: settings.targetElement.length,
        autoRotate: settings.isAuto,
        currentSlide: 0,
        nextSlide: function() {
        },
        prevSlide: function() {
        }       
    };

    return this.each(function() {



    });
};


jQuery(function(){
    $('#hp-feat-promo').featuredPromo();
});
 })(jQuery);

Answer 1

您需要创建一个全局变量或一个属于任何全局可访问对象的成员，例如jQuery的。

/* inside plugin */
jQuery.debugMessage = this.moduleValues = {};

/* outside plugin */
console.log( jQuery.debugMessage );

或者您可以设置a public getter function in your plugin。

但是你不能只从函数内部使用console.log()进行调试吗？

Answer 2

我发现在本文的“轻量级开始”中描述了实现我想要的最佳方法。 http://coding.smashingmagazine.com/2011/10/11/essential-jquery-plugin-patterns/

基本上，创建一个包含我的变量的类，然后添加到使用该插件的HTML元素的$ .data（）。

从中定义和访问jQuery插件的变量

2 个答案: