Javascript Can';t将事件与removeEventlistener一起使用:';e未定义';(Firefox)
我目前正在做OdinProject的一项任务,我必须创建一个div网格,你可以用鼠标着色,但我在这一过程中遇到了一个障碍 这是我的代码的工作版本。我可以解释这段代码的作用,但它非常简单。它在JSFIDLE上工作,所以我觉得最好您自己试试Javascript Can';t将事件与removeEventlistener一起使用:';e未定义';(Firefox),javascript,html,Javascript,Html,我目前正在做OdinProject的一项任务,我必须创建一个div网格,你可以用鼠标着色,但我在这一过程中遇到了一个障碍 这是我的代码的工作版本。我可以解释这段代码的作用,但它非常简单。它在JSFIDLE上工作,所以我觉得最好您自己试试 //创建div网格: 让mainDiv=document.createElement('div'); mainDiv.classList.add('grid') mainDiv.textContent=“”; 对于(i=0;i{ forEach(div=>{
//创建div网格:
让mainDiv=document.createElement('div');
mainDiv.classList.add('grid')
mainDiv.textContent=“”;
对于(i=0;i{
forEach(div=>{
if(event.target==div)div.classList.add('bk-gd-red');
})
})
//创建按钮
document.body.appendChild(mainDiv)
让newbutton=document.createElement('按钮')
newbutton.textContent=“重置”
document.body.insertBefore(newbutton,mainDiv);
//创建与按钮关联的单击事件
newbutton.addEventListener('click',(e)=>{
forEach(div=>
div.classList.remove('bk-gd-red');
让newRows=prompt('每边有多少平方?')
mainDiv.style.gridTemplateColumns=`repeat(${newRows},1fr)`
mainDiv.removeEventListener('mouseover',mumum)
})
.grid{
显示:网格;
网格模板列:重复(16,1fr);
利润率:0.10%
}
.bk gd红色{
背景色:红色;
}
页面标题
多亏了安德烈亚斯的评论,我才想出了一个解决方案
我所做的:
//new mumu
function mumu(e){
let gridNode=document.getElementById('main-div').querySelectorAll('div');
gridNode.forEach( div => {
if (e.target===div) div.classList.add('bk-gd-red');
})
}
//event function mumu called without passing arguments
let gridNode=mainDiv.querySelectorAll('div');
mainDiv.addEventListener("mouseover", mumu);
它需要使用全局变量或标识包含网格的主div。我想打球是一种更普遍、更安全的做法,所以我就这么做了
如果有人好奇,下面是代码的其余部分。它就像一个符咒
document.body.appendChild(mainDiv)
let newbutton=document.createElement('button')
newbutton.textContent="reset"
document.body.insertBefore(newbutton, mainDiv);
let gridNode=document.getElementById('main-div').querySelectorAll('div');
newbutton.addEventListener('click', (e)=>{
gridNode.forEach(div =>
div.classList.remove('bk-gd-red'));
let newRows=prompt('How many square per side?')
mainDiv.style.gridTemplateColumns= `repeat( ${newRows},1fr)`
mainDiv.removeEventListener('mouseover', mumu)
mainDiv.addEventListener('mouseleave', (e)=> {
mainDiv.addEventListener('mouseover', mumu)
})
})
无法复制。
mumu(gridNode,e)
立即执行mumumu
。但是在那个地方和时间没有e
,>ReferenceError:e是未定义的
当然,但是我已经尝试过mainDiv.addEventListener(“mouseover”,mumumu(gridNode,e.target));但它也不起作用(mumu函数被相应地修改)。我不明白为什么在addEventListener方法中使用事件时会出现“e未定义”错误