Получить «Active» атрибут и объект

Question

сегодня я начинаю на ОО в JavaScript, я создал 3 блоков (объект каждый)

Я присоединить к HTML-кода после их создания, но Когда я нажимаю на один из этих объектов, он не возвращает мне атрибут ACTIVE.

HTML контейнер, где я прилагаю блоки:

<div id="llens"> </div> 

Jquery:

$(document).ready(function() { 



/********************************** CREAtING OBJECT--> BLOC *************************************************/ 




function bloc(nom, top, left ,amplada,altura , actiu){ 
    this.nom=nom; 
    this.top = top+'px'; 
    this.left= left+'px'; 
    this.amplada= amplada+'px'; 
    this.altura = altura+'px'; 
    this.actiu = actiu; 


} 

function creaBloc(){ 
    bloc_profes = new bloc('bloc_profes', '40', '200','800','200','false'); 
    bloc_text = new bloc('bloc_text','100', '200','800','100','false'); 
    bloc_alumnes = new bloc('bloc_alumnes', '200', '200','800','200','false'); 

    var bloc1 = $('<div class="bloc professor" id="'+bloc_profes.nom+'" style="top:'+bloc_profes.top+'; left:'+bloc_profes.left+'; width:'+bloc_profes.amplada+'; height:'+bloc_profes.altura+' " >'); 
    var bloc2= $('<div class="bloc text" id="'+bloc_text.nom+'" style="top:'+bloc_text.top+'; left:'+bloc_text.left+'; width:'+bloc_text.amplada+'; height:'+bloc_text.altura+' " >'); 
    var bloc3 = $('<div class="bloc alumne" id="'+bloc_alumnes.nom+'" style="top:'+bloc_alumnes.top+'; left:'+bloc_alumnes.left+'; width:'+bloc_alumnes.amplada+'; height:'+bloc_alumnes.altura+' " >'); 

    $('#llens').append(bloc1); 
    $('#llens').append(bloc2); 
    $('#llens').append(bloc3); 
} 

creaBloc(); 

     $(".bloc").click(function (event) { 
     event.stopPropagation(); 

     bloc_nom = event.target.id; // New selected target 

     console.log('NOM: '+bloc_nom); 
     console.log('Actiu? : '+bloc_nom.actiu); 


     }); 


    }); 

Answer 1

Там нет ничего связывать ваши объекты и элементы DOM вместе. Учитывая текущую структуру, можно обернуть все объекты блока в другой объект:

// On the top scope inside document.ready 
var blocs = {}; 

Затем создайте блоки и добавить к этому объекту:

blocs['bloc_profes'] = new bloc('bloc_profes', 40, 200, 800, 200, false); 
blocs['bloc_text'] = new bloc('bloc_text', 100, 200, 800, 100, false); 
blocs['bloc_alumnes'] = new bloc('bloc_alumnes', 200, 200, 800, 200, false); 

Таким образом, вы будете иметь возможность сделать это в обработчик события:

$(".bloc").click(function (event) { 
    event.stopPropagation(); 
    var bloc_nom = this.id; 
    var bloc = blocs[bloc_nom]; 
    console.log('Actiu? : ' + bloc.actiu); 
}); 

---

Другой подход заключается в использовании JQuery .data, чтобы связать их вместе непосредственно в creaBloc:

bloc1.data('bloc', bloc_profes); 

Тогда в слушателе событий вы делаете:

$(".bloc").click(function (event) { 
    event.stopPropagation(); 
    var bloc = $(this).data('bloc'); 
    console.log('Actiu? : ' + bloc.actiu); 
});