JS动态生成元素无法添加dblclick事件问题求助

你的代码存在两个核心问题，导致双击事件无法触发：

1. 错误挂载元素到window对象 #

window是浏览器全局窗口对象，并非DOM元素，它不支持appendChild方法。你需要把动态创建的元素添加到页面的DOM容器中，比如document.body：

// 替换原代码中的 window.appendChild(windowHeader);
document.body.appendChild(windowHeader);

2. 动态生成的Div无可见交互区域 #

你创建的Div是空的，且如果.windowheader类没有设置宽高、背景等样式，元素在页面上的尺寸为0，根本无法被点击到。可以通过两种方式解决：

• 给Div添加文本内容：

  windowHeader.textContent = "双击我触发事件";
  

• 给.windowheader类设置基础样式（可写在CSS样式表中）：

  .windowheader {
    width: 200px;
    height: 60px;
    background-color: #eee;
    line-height: 60px;
    text-align: center;
    cursor: pointer;
  }
  

修正后的完整代码示例 #

const windowHeader = document.createElement("div");
windowHeader.classList.add("windowheader");
windowHeader.textContent = "双击我试试";
windowHeader.ondblclick = function() {
  alert("test");
};
// 挂载到正确的DOM容器
document.body.appendChild(windowHeader);

另外，也可以使用addEventListener绑定事件（和ondblclick效果一致，更推荐这种方式，支持绑定多个同类型事件）：

windowHeader.addEventListener('dblclick', function() {
  alert("test");
});

内容的提问来源于stack exchange，提问作者JoJjjo157