Как реализовать событие при клике на одном из элементов с одинаковыми классами

184

05 июля 2018, 02:00

Имеется несколько div c class='card'. как реализовать в js, чтобы при нажатии на одном из элементов происходило событие какое-либо? Вот ниже моя реализация которая не работает:

document.getElementsByClassName('card').onclick = function (){
   alert('asfd');
}

Div создается следующим образом:

var div=document.createElement('div');    
    div.classList='card'; 

for(i=1;i<4; i++){
    for(j=1;j<7;j++){
        var cardClone = div.cloneNode(true);        
        cardClone.setAttribute('grid-column',j);
        cardClone.setAttribute('grid-row',i);
        place.appendChild(cardClone);
    }

Answer 1

getElementsByClassName() выводит массив, для событий можно использовать так же и addEventListener(event, callback)

for(var i = 0; i < document.getElementsByClassName('card').length; i++) { 
  document.getElementsByClassName('card')[i].onclick = function (){ 
    alert('asfd'); 
  } 
}

Answer 2

place.addEventListener("click", function(e){
  if (e.target.classList.contains("card")) {
    alert("asfdf");
  }
});

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

Как сделать синхронизацию двух полей select?

Имеется два поля select c 4 опциями в каждом

201

javascript

сравнение элементов массивов на js

Хочу на js сравнить два массива и выстроить select и выделить все option которые соответсвуют условиюВот код:

152

javascript

Проблемка с модальным окном

Вот есть такое модальное окно:

197

javascript

Не работает плагин gulp-sourcemap

Имеется такой gulpfile

337