Zugriff auf Objekte in Objekte, die von Konstrukteuren erstellt

Question

Ich habe eine for-Schleife wie folgt:

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

Jetzt dieser Konstruktor hat einige vordefinierte Eigenschaften sowie einige bei der Initialisierung festgelegt. Wie die for-Schleife nahelegt, wird jedes obj innerhalb seines eigenen Index innerhalb des Arrays obj [] gehalten. Mein Problem ist, dass, nachdem ich durch die Initialisierung wiederholt haben, kann ich nicht die Eigenschaften einzelner Objekte mit einer

this.propertyName; 

oder

$(this).propertyName; 

Das Plugin Referenz Ich bin Gebäude arbeitet off Maus-Ereignisse (Klicks und Hover) Das heißt, ich muss in der Lage sein, das an das Ereignis angehängte Objekt auf bestimmte Eigenschaften des aktuellen Zustands zu prüfen, aber ich habe keine programmatische Möglichkeit zu wissen, welchen Index es im Array hat, um es zu referenzieren, oder zumindest einfach und prägnant.

Hat jemand dieses Problem gefunden und eine Lösung gefunden oder bin ich ziemlich gezwungen, das Array und den Index als Referenz zu verwenden? Jede Hilfe wäre großartig.

hier ist eine meiner Methoden zum Beispiel:

$.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

Sie die data function von jQuery verwenden können, um ein Objekt zu einem DOM-Elemente zu binden. So können Sie so etwas wie die folgenden tun, um Ihre Objekte zu speichern:

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

Und so etwas wie die folgenden zum Abrufen eines Objekts ein Ereignis gegeben:

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