简体   繁体   English

document.body.addEventListener 不工作

[英]document.body.addEventListener is not working

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.为此,我在 Firefox 中编写了一个扩展程序,我的屏幕阅读器通过套接字连接到该扩展程序并获取文本。 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).我需要获取光标下的当前元素,并且该函数在我自己编写的示例 html 页面中运行良好(因此该函数没有问题)。

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);"但是当我尝试将函数附加到扩展中的 JS 文件时,似乎“document.body.addEventListener('mouseover',myfunc(mEvent),false);”调用的函数is never called.永远不会被调用。 But if I call但如果我打电话

document.body.addEventListener('mouseover',function(mEvent){...},true);

myfunc is called. myfunc 被调用。

I'm new to javascript, so excuse me if it's a stupid question, But why the我是 javascript 新手,如果这是一个愚蠢的问题,请原谅,但是为什么

document.body.addEventListener('mouseover',function(mEvent){...},true);

is not working?不管用?

I always appreciated your nice helps and ideas.我一直很感激你的帮助和想法。 :) :)

There may be other issues here, but the syntax of your addEventListener call is incorrect and could be causing the issue you are seeing:这里可能还有其他问题,但您的addEventListener调用的语法不正确,可能会导致您看到的问题:

document.body.addEventListener('mouseover',myfunc(mEvent),false); is actually invoking "myfunc" at the same time you are invoking addEventListener and passing it as the second parameter.实际上是在调用addEventListener并将其作为第二个参数传递的同时调用“myfunc”。

You should instead be calling it this way:你应该这样称呼它:

document.body.addEventListener('mouseover',function() { myfunc(mEvent) },false);

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. Firefox 支持许多可访问性 API ,您可以直接从应用程序中使用这些 API。 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).这些 API 的优点是稳定,一旦你的实现完成,它应该继续工作(据我所知,只有一次 Mozilla 破坏了与现有屏幕阅读器的兼容性)。

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.通常,扩展在其 XUL 覆盖层中运行代码,这意味着上下文是浏览器窗口,而不是网页。 Which would explain why your code isn't working (it's a XUL document, no document.body there).这可以解释为什么您的代码不起作用(这是一个 XUL 文档,那里没有document.body )。 What you probably mean is attaching an event listener to the <tabbrowser> element where the web pages are loaded: gBrowser.addEventListener(...) .您可能的意思是将事件侦听器附加到加载网页的<tabbrowser>元素: 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 .旁注:如果您真的想捕获 XUL 文档上的所有事件,您应该在documentdocument.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).顺便说一句,您可以在错误控制台中看到与扩展相关的错误消息(我链接到的文章解释了如何在当前的 Firefox 版本中启用它)。

I also had the same problem and now solved it.我也有同样的问题,现在解决了。 After closing tag, try adding an document.body.addEventListener .结束标记后,尝试添加一个document.body.addEventListener Parser didn't recognize DOM object of the "addEventListener" event because HTML tag of DOM object is not closed.解析器无法识别“addEventListener”事件的 DOM 对象,因为 DOM 对象的 HTML 标记未关闭。

Refer to following.参考以下。 It works well.它运作良好。

<html>
    <body>
    ...
    <\body>

    <script type="text/javascript">
        document.body.addEventListener('click', function() { ... });
    </script>
</html>

按照弗拉基米尔帕兰特的建议,以下是有效的:

document.addEventListener('click', function() { ... }, false);

I suspect that the document is not yet ready, so there is nothing to bind to.我怀疑文档还没有准备好,所以没有什么可以绑定的。 Try adding an onload="addMyEventListener();"尝试添加onload="addMyEventListener();" to your <body> and see if that fixes things up.到你的<body>看看是否能解决问题。 I don't know the proper way to time things, so maybe someone else can chime in with the best way to handle this.我不知道计时的正确方法,所以也许其他人可以用最好的方法来处理这个问题。

Add height to a body element.为 body 元素添加高度。

<html>
<style>
    .vh {
        height: 100vh;
    }
</style>
<body class="vh">
    <script>
        document.body.addEventListener('click', () => {
            console.log('mouse click');
        });
    </script>
</body>
</html>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 如何将setTimeout添加到document.body.addEventListener? - How to add setTimeout to document.body.addEventListener? 为什么 document.body.addEventListener 事件在 document.addEventListener 之前运行? - Why does the document.body.addEventListener event run before document.addEventListener? 为什么 document.addEventListener 事件在 document.body.addEventListener 之后运行? - Why does the document.addEventListener event run after document.body.addEventListener? 如果单击 document.body.addEventListener 中的任何子项、孙子项(以及更深层次),如何点击父标记 - How to get click on parent tag if I click on any child, grandchild (and deeper) in document.body.addEventListener addEventListener - 附加到文档与 document.body - addEventListener - attaching to document versus document.body function 中的 document.addEventListener 不起作用 - document.addEventListener in function not working AddEventListener在$ {document).ready()内部不起作用 - AddEventListener is not working inside $(document).ready() 如果将它放在 head 部分而不是 body 中,则 addEventListener 不起作用 - addEventListener is not working if put it in head section rather then body Rails 6 + Webpack document.addEventListener 不起作用 - Rails 6 + Webpack document.addEventListener is not Working Console.log和document.addEventListener无法正常工作 - Console.log and document.addEventListener is not working
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM