i’m tring to create a drag and drop in a football website.
the drop event dosen’ t fire and i don’t know why.
this is the code where i create the span whith name of the player
let spanAttaccanti = document.createElement("span");
spanAttaccanti.addEventListener("dragstart", onDragStart);
spanAttaccanti.addEventListener("dragend",dragEnd)
spanAttaccanti.addEventListener("dragover", ondragover);
spanAttaccanti.addEventListener("dragenter", ondragenter);
spanAttaccanti.addEventListener("dragleave", onDragLeave);
spanAttaccanti.addEventListener("drop", ondrop);
spanAttaccanti.setAttribute("draggable", true);
spanAttaccanti.setAttribute("id", arrAttccanti[0][i]);
spanAttaccanti.innerHTML = arrAttccanti[0][i];
divAttacco2.appendChild(spanAttaccanti);
and this is the event.
<sup>let dragedItem
function onDragStart(event){
console.log("inizio")
setTimeout(()=>this.classList.add("hidden"),0)
dragedItem=this
}
function dragEnd(event) {
dragedItem=null
}
function ondragover(e) {
console.log("hover");
e.preventDefault()
}
function onDrop(event) {
console.log("drop");
event.preventDefault();
}</sup>
the proble is that the event onDrop
never fire.
my Console
please help
I’ m a noob of js and i’m starting to learning this langauage