javascript - 访问构造函数创建的对象中的属性

Question

我有一个像这样的 for 循环:

for (var i = 0; i < 10; i++) {
  obj[i] = new MapArea(some passed variables);
}

现在这个构造函数有一些预定义的属性以及一些在初始化时定义的属性。正如 for 循环所暗示的那样，每个 obj 都保存在数组 obj[] 中它自己的索引内。我的问题是，在迭代初始化后，我无法使用

引用单个对象的属性

this.propertyName;

或

$(this).propertyName;

我正在构建的插件通过鼠标事件(单击和悬停)进行操作，这意味着我需要能够检查附加到事件的 obj 的当前状态的特定属性，但无法以编程方式知道它所在的索引引用它的数组，或者至少可以轻松简洁地做到这一点。

有没有人遇到过这个问题并找到了解决方案，或者我几乎被迫使用数组和索引作为引用？任何帮助都会很棒。

这是我的方法之一:

$.fn.clickLight = function(options) {
  var defaults = $.extend( {
    color : "#43464B",
    opacity : "0.3"
  }, options);
  ctx.globalAlpha = defaults.opacity;

  $(area_ref).click(function(event) {
    $(this).handleMouse(event).each(function() {
      if (!$(this).clicked) { // I try and access here
        console.log(obj.this.clicked);
        $(this).highlight(defaults.color);
        $(this).clicked = true;
      } else {
        console.log(this.clicked);
        $(this).clearlight();
        $(this).clicked = false;
      }
    } );
  } );

  $(area_ref).hover(function() {
    $(this).handleMouse().each(function() {
      $(this).highlight(defaults.color);
    } );
  },function() {
    if (!$(this).clicked){ // I try and access here
      $(this).handleMouse().each(function() {
        $(this).clearLight();
       } );
    }
  } );
  return $(this);
};

Answer 1

您可以使用data function jQuery 将对象绑定(bind)到 DOM 元素。因此，您可以执行以下操作来存储对象:

$('#clickableElement1').data('mapArea', new MapArea(some passed variables));

像下面这样来检索给定事件的对象:

var mapArea = $(event.currentTarget).data('mapArea');