为某个div下img标签添加点击事件，可在新页面打开base64类型图片

最新推荐文章于 2025-07-03 10:33:58 发布

原创最新推荐文章于 2025-07-03 10:33:58 发布 · 2.5k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #javascript #html

这段代码定义了一个函数addImgClickEvent，用于为指定ID元素下的所有图片添加点击事件。当图片被点击时，会在新窗口中打开一个包含该图片的简单HTML页面，并设置鼠标指针样式为手形。

export const addImgClickEvent = (id) => {
  var objs = document.getElementById(`${id}`)?.getElementsByTagName('img');
  for (var i = 0; i < objs?.length; i++) {
    objs[i].onclick = function () {
      // iFrameOpenImg(this.src);
      let str = '<!DOCTYPE html><html><body><div><img src=' + this.src + ' /></div></body></html>';
      let newOpen = window.open(
        '',
        '_blank'
        // 'scrollbars=1,resizable=1,width=1000,height=580,left=0, top=0'
      );
      // newOpen.document.write(this.outerHTML);
      newOpen.document.write(str);
      newOpen.document.close();
    };
    objs[i].style.cursor = 'pointer';
  }
};