Update index.md

[pauIbanez]

at first glance it looks like the dragenter event was missed, then it's celar you put only dragover on both cases to show that you can cancel the even by employing ether way, I just aim to make it so the codeblobk guides more by including both necessary events.

Summary

Motivation

Supporting details

Related issues

Metadata

• Adds a new document
• Rewrites (or significantly expands) a document
• Fixes a typo, bug, or other error

[github-actions]

Preview URLs

• https://pr20048.content.dev.mdn.mozit.cloud/en-US/docs/Web/API/HTML_Drag_and_Drop_API/Drag_operations

Flaws

URL: /en-US/docs/Web/API/HTML_Drag_and_Drop_API/Drag_operations
Title: Drag Operations
on GitHub
Flaw count: 2

• broken_links:
  • Can't resolve /en-US/docs/XUL/image
  • Can't resolve /en-US/docs/XUL/separator

External URLs

URL: /en-US/docs/Web/API/HTML_Drag_and_Drop_API/Drag_operations
Title: Drag Operations
on GitHub

No new external URLs

[wbamberg]

Hello @pauIbanez , and thanks for your PR!

I agree that some change like this would be an improvement. However, note that the attribute has an on prefix.

However, we should not use HTML event handler properties in our examples! See https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Events#inline_event_handlers_%E2%80%94_dont_use_these.

So I think it would be better to rewrite this section to use addEventListener() and preventDefault() - something like:

If you want to allow a drop, you must prevent the default handling by cancelling both the dragenter and dragover events by calling their preventDefault() method:

element.addEventListener('dragenter', e => {e.preventDefault()});
element.addEventListener('dragover', e => {e.preventDefault()});

We should also go through this whole page replacing HTML event attributes with addEventListener - for example the page also does this at https://github.com/mdn/content/blob/main/files/en-us/web/api/html_drag_and_drop_api/drag_operations/index.md?plain=1#L32.

Please let me know if you want to do this, or you'd rather I close this PR and make these updates myself.

[pauIbanez]

You can close and make the changes yourself. I agree on the formatting ofc, and sorry for the on prefixes. I was doing research while working with react and I used react's events instead of the vanila ones.

Thank you for your service to the comunity!

[wbamberg]

You can close and make the changes yourself. I agree on the formatting ofc, and sorry for the on prefixes. I was doing research while working with react and I used react's events instead of the vanila ones.

Thank you for your service to the comunity!

Thanks for letting me know!

I just filed #20403 for this.