Dzień dobry!
Próbuję zrobić małą grę, gdzie przekłada się karty na planszy. Zredukowany kod wrzuciłem tutaj: https://jsfiddle.net/fmc13/bads762j/
Każdy pusty div ma swój id: p11, p12 itd. Natomiast divy z kartami są oznaczone z4 i z5. Zależy mi na uzyskaniu następującego efektu:
1. Klikam div o id=z4 a następnie div o id=p11. Wtedy docelowy div zmienia swój id na z4 a div na którym znajdowała się karta z4 zmienia id na p31.
2. Klikam znowu div, który aktualnie jest z4 i przenoszę go na p12, który zmienia oznaczenie na z4. Div z którego "wziąłem" z4 wraca do id=p11.
3. Klikam znowu div z4 i przenoszę go na p11 a "stary" div wraca do id=p12.
Itd.
Problem ma z addEventListenerByID, gdyż nie mogę dynamicznie przypisać go do pola które "zniknęło" czyli np. p11 a następnie pojawiło się znowu.
Próbowałem skorzystać z rozwiązania z wykorzystaniem querySelector i target (jak poniżej) ale nie udało mi się uzyskać pożądanego efektu.
var itemTeam = document.querySelector(".pozycja-lawka");
var itemT = document.querySelectorAll(".lawka");
itemTeam.addEventListener("click", function(ev){
firstCard(ev.target);
}, false);
Będę wdzięczny za pomoc.
Pozdrawiam
Filip.