2

这可能是一个非常愚蠢的问题,但我想了解其背后的原因。我为糟糕的问题标题道歉。

下面的代码有效。当 btn 元素有 mousedown 事件时,会显示一个菜单,并添加一个事件侦听器来隐藏文档中任何位置的 mousedown 事件的菜单。如果在显示菜单时单击 btn,则不会再次添加该事件,而是通过调用函数 clear 将其删除。所以,根本没有什么特别的。

我不明白并且浪费了很多时间的是,如果在 menu_func 中声明了 clear 函数,则在第二个 btn mousedown 事件时不会删除文档上的事件侦听器。(我的意思是简单地将 menu_func 的右大括号移到 clear 函数的右大括号之后。)调用 clear 函数并执行其余代码,但在文档有鼠标之前不会删除事件侦听器down 事件,然后它记录多个已删除的事件侦听器消息。

如果没有向控制台日志写入任何内容,人们会认为代码以任何一种方式工作,但事实并非如此。

请解释我在这里不明白的地方。谢谢你。

btn.addEventListener( 'mousedown', menu_func, false );


function menu_func(evt) {
    evt.stopPropagation(); 
    let e = evt.currentTarget;
    if ( e.disp ) { 
        clear();
    }
    else { 
        document.addEventListener( 'mousedown', clear, false );
        e.disp = true;
        /* Some CSS style code to display menu. */
        console.log('Event Listener Added');
    }; // end if         
} // close menu_func

function clear() {
    document.removeEventListener( 'mousedown', clear, false );
    e.disp = false;                 
    /* Some CSS style code to remove menu. */
    console.log('Event Listener Removed');
} // close clear
4

0 回答 0