鼠标移动指针事件无 div

克隆

我如何在指针事件无 div 上触发 mousemove 事件,我无法编辑页面的 html,只有 javascript(银行)

<h1>title</h1>
<div class="wrapper">
  <h3>element 1</h3>
  <h3>element 2</h3>
</div>

该脚本目前仅将主体作为目标而不是元素触发

document.body.addEventListener("mousemove", function(e) {
  console.log(e.target)
})

https://codepen.io/anon/pen/PxOMQL

斑比我们的主

我想这就是你要找的。一旦鼠标移动到带有类包装器的 div 内的任何内容上,它就会记录它。

let wrappers = document.getElementsByClassName("wrapper");
for ( let i = 0; i < wrappers.length; i++ ) {
    wrappers[ i ].style.pointerEvents = "auto";
    wrappers[ i ].addEventListener( "mousemove", function(e){
    console.log( e.target );
    });
}
.wrapper {
 pointer-events: none; 
}
<h1>title</h1>
<div class="wrapper">
  <h3>element 1</h3>
  <h3>element 2</h3>
</div>

编辑:您可以使用 JavaScript 覆盖包装器的 CSS 类以将指针事件设置为自动,否则在 CSS 中将鼠标事件设置为无时,鼠标事件将不起作用。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

使用JavaScript鼠标事件拖动DIV可以快速移动

来自分类Dev

模拟DIV的拖动,鼠标指针快速移动会出现问题

来自分类Dev

jQuery div用鼠标移动

来自分类Dev

用鼠标拖动移动DIV

来自分类Dev

更改div上的鼠标指针位置时发生多个mouseover-mouseout事件

来自分类Dev

鼠标移动使div移动平滑倒置

来自分类Dev

移动与鼠标移动相反的大 div

来自分类Dev

根据鼠标指针更改div的位置

来自分类Dev

react div中的鼠标元素移动

来自分类Dev

只需单击鼠标即可移动DIV?

来自分类Dev

使画布注册鼠标在div上移动

来自分类Dev

用鼠标单击在 div 容器之间移动 div

来自分类Dev

根据鼠标移动来移动div的每个字符

来自分类Dev

允许指针事件通过嵌套的div

来自分类Dev

禁用鼠标指针移动

来自分类Dev

鼠标指针自行移动

来自分类Dev

处理“ onclick”事件时无法移动“ div”

来自分类Dev

使用指针事件单击重叠的div并隐藏div

来自分类Dev

使用指针事件单击重叠的div并隐藏div

来自分类Dev

获取相对于某些div的鼠标指针坐标

来自分类Dev

(jquery)如何在[div]元素中冻结鼠标光标(指针)?

来自分类Dev

滚动事件以移动 div 不始终朝着正确的方向移动

来自分类Dev

使div停留在其父级鼠标移动中

来自分类Dev

p5在鼠标移动时显示div

来自分类Dev

两个div不能处理鼠标事件

来自分类Dev

鼠标悬停或单击div上的事件时阻止淡出

来自分类Dev

使div围绕移动的div旋转

来自分类Dev

CSS div浮动-移动div

来自分类Dev

使div围绕移动的div旋转