我会进入正题我在尝试什么？： 我尝试克隆项目，以便每个项目在单击时都会克隆自身。即使是那些被克隆的。问题： 问题是，当我克隆了 10 个项目时，单击第一个（原始）项目后，它会克隆接下来的 10 个项目。无论我已经拥有多少个元素，只有最后一个（最新的）克隆会克隆一个元素。信息： 如果“克隆”函数末尾没有 app()，则只有原始元素添加更多克隆。这是 clondeNode() 的问题还是可能是错误的未对齐的 addEventListener 问题？感谢您提前提供的帮助，马特JS：app = () => { const divs = document.querySelectorAll('.div'); divs.forEach((div) => { div.addEventListener('click', () => clone(event)) })}clone = (event) => { const div = event.target; const clone = div.cloneNode(true); document.body.appendChild(clone) app()}app()HTML：<body> <div class='div'>DIV FOR CLONING</div> <script src="main.js"></script></body>
2 回答
慕哥9229398
TA贡献1877条经验 获得超6个赞
单击后调用时app()，您可以向所有现有元素添加一个新的事件侦听器，这是对它们已附加的处理程序的补充。
无需app在那里调用，只需将侦听器添加到新创建的克隆即可。
其次，函数和变量使用相同的名称。这很令人困惑。
因此以不同的方式命名该变量：
const clonedDiv = div.cloneNode(true);
document.body.appendChild(clonedDiv);
clonedDiv.addEventListener('click', clone);如您所见，您也不需要该箭头函数。clone只需作为函数参数传递即可。
幕布斯6054654
TA贡献1876条经验 获得超7个赞
在克隆函数中，您再次调用 app()
app = () => {
const divs = document.querySelectorAll('.div');
divs.forEach((div) => {
div.addEventListener('click', () => clone(event))
})
}
clone = (event) => {
const div = event.target;
const clone = div.cloneNode(true);
document.body.appendChild(clone)
app() // <<<<<<-------HERE
}
这会以递归结束，因为每次单击它都会添加一个新的侦听器。
https://codesandbox.io/s/agitated-cohen-0j6dm
const clone = event => {
const div = event.target;
const cloned = div.cloneNode(true);
document.body.appendChild(cloned);
cloned.addEventListener("click", clone);
};
- 2 回答
- 0 关注
- 125 浏览
添加回答
举报
0/150
提交
取消