I'm working on a screen reader project and I needed to get the paragraph under the cursor. To do that in Firefox, I wrote an extension, to which my screen reader connects through sockets and gets the text. I needed to get the current element under the cursor and the function worked fine in a sample html page written by myself (So there is no problem with the function).
But when I try to attach the function to my JS file in the extension, It seems that the function which is called by "document.body.addEventListener('mouseover',myfunc(mEvent),false);" is never called. But if I call
document.body.addEventListener('mouseover',function(mEvent){...},true);
myfunc is called.
I'm new to javascript, so excuse me if it's a stupid question, But why the
document.body.addEventListener('mouseover',function(mEvent){...},true);
is not working?
I always appreciated your nice helps and ideas. :)
Definition and Usage. The addEventListener() method attaches an event handler to a document.
To add an event listener to the body element: Access the body element on the document object. Use the addEventListener() method on the body element in the useEffect hook. Remove the event listener when the component unmounts.
Summary: addEventListener can add multiple events, whereas with onclick this cannot be done. onclick can be added as an HTML attribute, whereas an addEventListener can only be added within <script> elements.
Right-click on the search icon button and choose “inspect” to open the Chrome developer tools. Once the dev tools are open, switch to the “Event Listeners” tab and you will see all the event listeners bound to the element. You can expand any event listener by clicking the right-pointing arrowhead.
While this isn't a direct answer to your question, I hope that it is helpful nevertheless. Using an extension for a screen reader is unnecessary, in particular you might not want to update that extension regularly as the browser's user interface changes. Firefox supports a number of accessibility APIs which you can use directly from your application. These APIs have the advantage of being stable, once your implementation is done it should continue working (as far as I remember there was only one occasion where Mozilla broke compatibility with existing screen readers).
As to the actual question: you didn't tell anything about the context in which this code is executing. Normally, extensions run code in their XUL overlay meaning that the context is the browser window, not the web page. Which would explain why your code isn't working (it's a XUL document, no document.body
there). What you probably mean is attaching an event listener to the <tabbrowser>
element where the web pages are loaded: gBrowser.addEventListener(...)
. Side-note: If you really wanted to catch all events on a XUL document you should register an event listener on document
or document.documentElement
.
Btw, you can see error messages related to extensions in the Error Console (the article I link to explains how to enable it in the current Firefox versions).
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With