Question

最重要的是，抱歉我的英语不好。

我遇到了jquery插件的上下文问题我正在开发中。我在下面的插件中创建的每个实例都指向最后一个对象。例如：

var a = $("#a").EscribirConAdjuntos();
var b = $("#b").EscribirConAdjuntos();
var c = $("#c").EscribirConAdjuntos();

结果是a和b修改了c对象，我会尝试更好地解释，但我不知道为什么。

如果我做a.setText（＆＃34;文字A＆＃34;）;它将修改存储在c。

中的实例所附加的textarea

(function(window, $){
    var pluginName = 'EscribirConAdjuntos';
    if(typeof $ === "undefined")
        return console.error('No esta añadida la librería jquery.js');

    var defaults = {
        btnGuardar : false,
        onGuardar : $.noop,
        onActualizar : $.noop,
        texto : false,
        media : false,
    };



    /* Constructor principal */
    var Plugin = function ($el, options){
        this.o = $.extend( {}, defaults, options);
        this.$.el = $el;
        // I add this textarea
        this.$.textarea = $('<textarea></textarea>').appendTo(this.$.el);
        return this;

    };
    Plugin.prototype = {
        $:{},
        setText : function(text){
             this.textarea.val(text);
        }
        /* Some functions */

    };




    $.fn[pluginName] = function(options, args){
        var $this = $(this);

        var plugin = $this.data(pluginName);
        if(!plugin){
            plugin = new Plugin($this, options);
            $this.data(pluginName, plugin);
            return plugin;
        } else {
            if(plugin[options] && typeof plugin[options] == 'function')
                return plugin[options].apply(plugin,args);
            else
                return plugin;
        }
    };
})(window, jQuery);

Answer 1

问题不在于函数的this值。问题是Plugin.prototype.$对象。 $构造函数的所有实例的Plugin属性引用同一个对象，即当您重置el对象的textarea和$属性的值时，它们将被重置为所有实例。

> a === b
false
> a.$ === b.$
true

在构造函数中定义$属性。

/* Constructor principal */
var Plugin = function ($el, options){
    this.o = $.extend( {}, defaults, options);
    this.$ = {};
    this.$.el = $el;
    // I add this textarea
    this.$.textarea = $('<textarea></textarea>').appendTo(this.$.el);
    return this;
};
Plugin.prototype = {
    // $:{},
    setText : function(text){
       this.$.textarea.val(text);
    }
};

Javascript这一点指向最后一个对象实例

1 个答案: