html - 文档未捕获嵌入式文档引发的事件

标签 html event-handling svg

我有一个包含带有对象标签的嵌入式 SVG 的 HTML。我在全局文档上为 mousemove 注册事件监听器,但是当鼠标移动发生在嵌入式 SVG 文档内的元素上时,不会调用在全局文档上为 mousemove 注册的回调。嵌入似乎是这里的问题,但无法弄清楚问题是什么,我认为 SVG 文档是全局文档的子项,全局文档应该获取所有事件。有人可以帮忙吗?全局文档和SVG文档没有关系吗?

最佳答案

我试过以下方法:

<div style="position:relative; background-color:red; height:300px">
    <object data="http://upload.wikimedia.org/wikipedia/commons/c/c7/SVG.svg" type="image/svg+xml" height="300" width="400" style="position:absolute;z-index:1;" 
        onclick="console.log('clickSVG');" 
        onmousemove="console.log('moveSVG');"
        ></object>
    <div style="height:150px; background-color:blue; z-index:2;"
        onclick="console.log('clickDIV');" 
        onmousemove="console.log('moveDIV');"></div>
</div>

基于在对象之上分层的 div 可能会捕获事件的想法,但事实并非如此。我真的不知道为什么;完全在 JS 中创建 SVG 对象并直接附加处理程序可能值得一试。

编辑:抱歉挖掘旧帖子,我意识到有点晚了;我希望这仍然可以帮助任何人。

关于html - 文档未捕获嵌入式文档引发的事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6187303/

相关文章:

html - 如何居中 div 并放置在另一个 div 的底部

javascript - SVG 图像无法在 Internet Explorer 11 的 echarts 工具箱中呈现

php mysql pdo postdata htm - 无法将数据正确获取到 mysql 错误

javascript - 使用 React 使 Web 应用程序完全适合屏幕

event-handling - JavaFX 2 中的键绑定(bind)

excel - 停止 OnTime 事件

svg - 如何更改 Foundation 5 <select> 下拉三角形的颜色

javascript - 有没有办法在显然不支持此代码的浏览器中实现此效果?

html - 添加子 div 时父 div 的背景图像为 "collapses"

c# - 对于生命周期较短的对象,是否需要取消订阅事件?