data-long-press-delay is not overriden when the element has child element about long-press-event HOT 6 CLOSED

Hello @PollerBoom, this will be happening because the child div is the one throwing the event. If you want to change the child div, you'd need to add the attribute to that item:

<div>
  <div data-long-press-delay="500">
     Sample text
  </div>
</div>

Or, you could try disabling pointer-events for the child item via CSS. This should cause the event to bubble up to the parent, example:

HTML

<div data-long-press-delay="500">
  <div>
     Sample text
  </div>
</div>

CSS

div[data-long-press-delay="500"] div {
    pointer-events: none;
}

from long-press-event.

Hello👋

I'm replying from my phone, so not able to test this. But it's generally a bad idea to attach an event to every item in a list. It's better practice to attach the event listener to the parent container, and use e.target to determine if you want to respond to the event.

Give this a try

from long-press-event.

Thanks for the library 👍

Ideally the function starting the timer would check up the DOM tree until it found a data-long-press-delay value, otherwise use the default. Turning off pointer events for child elements prevents things like mouse hover from working. For now I'm just going to bring in the code and modify the value directly.

from long-press-event.

Thanks a lot for your library @john-doherty

I am not sure my problem is related to this issue or not.
Could you check this test page?
(see also longpress_test.css and longpress.js)

I intended to attach the longpress event to each item in a long list of span elements.
I want the span title tag to be shown in alert message when mobile user long-press the span.

Sometimes the span structure is like this (<span><i><b>text</b>more text</i></span>), but many other times it does not contain italics or bold tags.

With computer mouse there is no problem, but the longpress event is not fired when I use my mobile browser.
Can you test it and check the reason?

Many thanks in advance
@abubelinha

from long-press-event.

Thanks a lot for that advice. Now I am more interested in it than in my original issue 😅.

So in a long list of elements, following your advice would imply what? Saving a lot of RAM because event listeners will only be attached to just a parent element and propagated to a few user-long-pressed span elements? (instead of i.e. 3000 attachments).
I have no idea about the RAM or time waste implications of each attachment.

My guess is the download size wouldn't change: in both ways the events are attached after page load.

Sorry about silly question, I am not an expert.

from long-press-event.

Also one more question: should the script with your code be put in a particular section of the html page, after/before whatever?
I don't see comments or guidelines about this, but just in case.

from long-press-event.