jquery - 从 jQuery 原型(prototype)函数 ($.fn) 获取实例/引用

标签 jquery reference prototype instance custom-data-attribute

我编写了一个使用原型(prototype)的 jQuery 插件。

示例:

  function MyWidgetConstructor(element) {

    this.id = 'test';
    this.$element = $(element);
    this.$element.data('instance', this);

  }

  MyWidgetConstructor.prototype.sayHello = function() {
    alert('Hello, my ID is: ' + this.id);
  }

  $.fn.myWidget= function() {
    return this.each(function() {
      new MyWidgetConstructor(this);
    });
  };

我使用数据属性来保存对小部件的引用。这样我就可以使用实例变量调用原型(prototype)方法,如下所示:

    jQuery('#myInstance').myWidget();
    jQuery('#myInstance').data('instance').test();

但是,这并不总是有效。是否有另一种方法来获取引用(也许不使用数据属性)?

最佳答案

我找到了另一种方法!可以使用全局实例数组来管理不同的实例。

示例:

(function ($) {

    window.InstanceCollection = window.InstanceCollection || {};

    $.fn.myWidget = function () {
        return this.each(function () {
            new MyWidgetConstructor(this);
        });
    };       

    function MyWidgetConstructor(element) {
        this.id = 'test';
        window.InstanceCollection[this.id] = this;
    }

    MyWidgetConstructor.prototype.sayHello = function () {
        alert('Hello, my ID is: ' + this.id);
    }

})(jQuery)

jQuery(function ($) {
    $('#myInstance').myWidget();
    window.InstanceCollection['test'].sayHello();
})

关于jquery - 从 jQuery 原型(prototype)函数 ($.fn) 获取实例/引用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19897054/

相关文章:

javascript - 为什么是 $ ('[tabindex="1"]' ).focus();关注 tabindex ="2"?

javascript - 从 jQuery 函数内部公开函数

PHP函数数组参数引用

javascript - Function.prototype.method 什么是原型(prototype)[名称]

javascript - JQuery/Javascript Hook

javascript - 使用 jQuery 在 html 中动态设置默认选择

C++:取消引用实际上在做什么?

c++ - 用引用隐藏指针

javascript - 扩展对象导致 jQuery 错误

JavaScript instanceof 运算符何时返回 true 应该为 false?