Question

我正在构建一个所见即所得的编辑器，如果选择范围包含图像，则需要检查用户是否单击了图像。有没有办法检测到这个没有添加事件处理程序到图像？！我正在检查keyup和mouseup并能够检测是否使用Tim Down的getselectedtext（）函数选择了文本，并且想通过检查选择是否包含el.nodeName来检查所选范围是否是图像标记。

如果使用Tim Down的getselectedtext（）函数完全突出显示图像，我可以检测到图像但是如果只是单击图像（每个角上有四个正方形）而不是在拖动鼠标后以蓝色突出显示，则不返回任何内容穿过它。有任何想法吗？纯JS请。

Answer 1

当然，只需在整个文档上放一个监听器（只需要连接一次监听器），然后检查event.target（被点击的元素）是否是图像。

＆＃13;

document.body.addEventListener('click', (event) => {
  if (event.target.tagName === 'IMG') {
    console.log('image clicked');
  }
});

＆＃13;

<div>content</div>
<img src="https://www.gravatar.com/avatar/34932d3e923ffad9a4a1423e30b1d9fc?s=48&d=identicon&r=PG&f=1">
<div>more content</div>

＆＃13;

Javascript检查是否在点击时选择了图像

1 个答案: