Questions tagged [dom-events]
DOM (Document Object Model) events allow event-driven programming languages to register various event handlers/listeners on the element nodes inside a DOM tree.
dom-events
12,536
questions
0
votes
1
answer
27
views
How can I init an editor on a textarea added dynamically in jQuery?
I have a form where I can add many textareas as I want when I click on a button. Each textarea must be a ckeditor.
I managed to init the existing textareas but I don't know how to do it for ones added ...
- 804
0
votes
0
answers
49
views
Force React to rerender between processing simultaneous mouse events
Here is a basic example of the issue. A component contains two nested divs. We can keep track of the "depth" of the mouse position (0 if outside both divs, 1 if inside the outer div but ...
- 298
0
votes
2
answers
42
views
handle Esc key on form in a A11y friendly way
I have a form in a Svelte app like this:
<!-- markup for editing todo: label, input text, Cancel and Save Button -->
<form on:submit|preventDefault={onSave} class="stack-small" ...
- 62.3k
-1
votes
1
answer
32
views
document.activeElement not displaying focused elements within shadow root
document.activeElement is neat, but when using it on a site that uses shadow root - I get the outer container. How can I get the active element within nested shadow roots?
Do I need to crawl through ...
- 1,700
0
votes
0
answers
22
views
Detecting Browser Event (blur, visibilitychange etc) Blocking by Third-Party Applications in Next.js (Version 13)
I'm developing a web application using Next.js version 13 that includes critical browser events like blur and fullscreenchange . These events are essential for user interaction, but they can be ...
-1
votes
1
answer
66
views
How to target a specific element of an array?
I'm currently working on a To-do-list from the odin project. As per the instructions, my todolist can create a new project, which we can then add tasks to the project. I now have a sidebar listing all ...
- 3
0
votes
1
answer
34
views
How does setTimeout in a focusIn handler resolve before the click handler runs?
I expect DOM event handling to be synchronous, regardless of the internal sequence of events in a browser.
For reasons I don't understand the click handler is massively delayed (varying between 30-...
- 55.9k
0
votes
0
answers
16
views
Error thrown when trying to open file for Chrome Extension - User gesture required
I'm developing a Chrome extension using manifest V3. The extension allows the user to download a file onto their default directory. The user is then presented with a button to click on to open the ...
- 13
0
votes
1
answer
31
views
Add event handlers like "onclick" or "onchange" as public class field on a customized built-in element
I have standard handlers for the click, input and change events of my customized HtmlInputElement.
I want to define these handlers like this:
class MyInputElement extends HTMLInputElement {
...
- 1,759
2
votes
2
answers
79
views
Event listner not getting initiated
I have a embeddable script that can be placed in the header of any host website. it fetched form and then attached submit event to them. it works in majority of the cases but on some websites, there ...
- 21
1
vote
0
answers
41
views
How to listen to webpage button triggered copy events?
I want to create a simple chrome extension that replaces the url that you copied from the "share > Copy link" button of reddit with a short link, but I don't know how to listen to the ...
- 149
-1
votes
1
answer
43
views
Stop propagation or other event needed for clicking in checkbox label?
My blade component show-on-check seems to have an error with alpine.js. It uses a custom checkbox-input with a label. Input and label are clickable.
Component show-on-check:
@props([
'label',
'...
0
votes
2
answers
76
views
How can I reset a div to its initial values when the document element in javascript is clicked
With HTML and JS, I have a div called ball and it follows my cursor wherever it goes, only when I click on it, so my problem is that I want it when I click on the document element it goes to its ...
0
votes
0
answers
22
views
React Table Row click annotation / popup for showing the selected row
I tried to show the popup message in the end of the clicked row, but it is showing popup by using unwanted height and width position i need to show it within the end of right side of the row.
i ...
- 41
-1
votes
2
answers
33
views
How to create a click handler and window.addEventListener in TypeScript (Next.js)?
I have a click handler that I want to listen to any clicks on the window outside of my component:
useEffect(() => {
const handleOutSideClick = (event) => {
if (!ref.current?.contains(...
