Drop-Ereignis nicht ausgelöst/Auslösung in JS

Question

Probe: https://jsfiddle.net/u3m4eazx/

Ich habe 2 Bilder, die ziehbar und 3 divs sind, wo Sie die Bilder ablegen können ($ Dropzones).

$dropZones.forEach($z => { 
    $z.addEventListener('dragover', onDragOver); 
    $z.addEventListener('dragleave', onDragLeave); 
    $z.addEventListener('drop', onDrop); 
}); 

Die dragover- und Dragleave Ereignisse auslösen und perfekt funktionieren. Ich mache einen Hover-Effekt für das div, indem ich eine CSS-Klasse hinzufüge.

const onDragOver = e => { 
    e.preventDefault; 
    let id = e.target.dataset.id; 
    let dropzone = document.querySelector(`.dropzone[data-id="${id}"]`); 
    dropzone.classList.add('ready'); 
}; 

Und im Dragleave-Ereignisse nur die Klasse I entfernen. Sie funktionieren also gut.
Aber das Drop-Ereignis wird nicht ausgelöst. Dies ist, was ich in der Drop-Ereignis haben

Wer weiß, warum das Ereignis nicht ausgelöst wird?

Answer 1

Ja, also schaute ich zurück und fand heraus, dass die preventDefault() Funktion falsch geschrieben ist.
Ich schrieb es ohne ().
Danke trotzdem.