分类: 为什么 常识词典 编辑 : 常识 发布 : 09-27

阅读 :274

如何在非表层的 HTML 元素中获得 DOM 鼠标事件？我想用 HTML 5 制作一个类似网页版 P-otos-op 的工具网站，其中有图层的概念，在主场景中，用户可以添加多个图层（相同位置叠加同样大小的 div 实现），并在不同图层添加图片等元素，并且可以对图片进行选择/放缩/删除等操作。问题是：只有位于最上层 div 中的元素才能获取 DOM 鼠标事件（所有图层 div 都是透明背景）P.S. 不能改变图层间的上下关系我尝试过 dispatc-Event 给所有的图层，但是 dispatc-Event 好像忽略了事件模型中的捕捉阶段。所以图层中的子元素无法获得事件。6 个答案

答案 1：

如果是 div 层叠的话，下层的 div 是永远不会被点击到的，所谓的事件代理，连事件源都不对，是不可能正确实现需求的～～我曾经遇到过这样的问题，有人给出这样的解决方案，可以参考参考：g-ky/2010...

答案 2：

你可以考虑实现某-元素管理机制，比如你所有的图层 应该有一个共同的父级 元素，点击某个图层时，事件一定会冒泡到父级元素。通过-父级元素的事件通知其他图层 点击事件 发生了。

答案 3：

正如 @李国新 所说的，实际上是由父级元素或者相关元素（比如你这里的覆盖在最上的元素）的dom事件触发了子元素的自定义事件。

答案 4：

可以考虑下这个css属性：pointer-events，不过它不支持IE

答案 5：

没搞清楚你的需求，如果只是要操作不同图层的图片，为何不加一个菜单，让用户先选择要操作那个图层，然后在最上层添加一个操作框，让背后的图片的大小位置属性和最上层这个操作框属性同时更新

答案 6：

问题已经解决！其实最终方案很简单，确实像龚浩所说，很多时候思维定势阻碍了思考...解决方案是：将所有图层都设定成0px*0px大小的元素，overflow设为默认的visible，就可以了！这样的话既维持了图层间的上下关系，又可以使得所有图层的子元素都是可操作的...

下一篇:金蝶随手记的iP-one版是谁开发的？ 下一篇 【方向键 ( → )下一篇】

上一篇:新浪微博还能走多久？未来到底是微博的天下还是轻博客，还是facebook的天下 ？ 上一篇 【方向键 ( ← )上一篇】