Javascript 动态显示菜单的js创建onclick事件

我想为网站上动态创建的弹出菜单添加onclick事件。下面是一个代码：

<div id="rmenu">
   <div class="rmenu_options">
        <a href="#" id="start" >Create starting point</a>
   </div>
   <div class="rmenu_options">
       <a href="#" id="goal">Create goal point</a>
   </div>
</div>

.rmenu_options {
    margin-bottom: 7px;
    cursor: pointer;
    }
#rmenu {
    display: none;
    position: absolute;
    background: bisque;
    width: 175px;
    height: 55px;
    padding: 10px;
    border-radius: 6px;
    font-size: 18px;
}

// create mouse rightclick menu

function mouseX(evt) {
    if (evt.pageX) {
        return evt.pageX;
    } else if (evt.clientX) {
        return evt.clientX + (document.documentElement.scrollLeft ?
    document.documentElement.scrollLeft :
    document.body.scrollLeft);
    } else {
        return null;
    }
}

function mouseY(evt) {
    if (evt.pageY) {
        return evt.pageY;
    } else if (evt.clientY) {
        return evt.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);
    } else {
        return null;
    }
}

window.oncontextmenu = function openRightClickMenu (e) {
    e.preventDefault();
    document.getElementById("rmenu").style.display = "block";
    document.getElementById("rmenu").style.top = mouseY(e) + 'px';
    document.getElementById("rmenu").style.left = mouseX(e) + 'px';
    document.getElementById("rmenu").classList.add("opened");

    window.event.returnValue = false;
}

// remove mouse rightclick menu

document.onmousedown = function removeRightClickMenu (e) {
    if (e.which == 1) {
        if (document.getElementById("rmenu").classList == "opened") {

            document.getElementById("rmenu").classList.remove("opened");
            document.getElementById("rmenu").style.display = "none";
        }
    }  
}

// ???
document.getElementById('rmenu').addEventListener("click", function() {
    function whatToDo (e) {
        if (e.target.id == 'start') {
            console.log("start clicked")
        } else if (e.target.id == 'goal') {
            console.log("goal clicked")
        }
    }
});

.rmenu选项{
边缘底部：7px；
光标：指针；
}
#rmenu{
显示：无；
位置：绝对位置；
背景：bisque；
宽度：175px；
高度：55px；
填充：10px；
边界半径：6px；
字号：18px；
}
//创建鼠标右键单击菜单
功能鼠标（evt）{
如果（evt.pageX）{
返回evt.pageX；
}else if（evt.clientX）{
返回evt.clientX+（document.documentElement.scrollLeft？
document.documentElement.scrollLeft：
document.body.scrollLeft）；
}否则{
返回null；
}
}
功能鼠标（evt）{
如果（evt.pageY）{
返回evt.pageY；
}else if（evt.clientY）{
返回evt.clientY+（document.documentElement.scrollTop？document.documentElement.scrollTop:document.body.scrollTop）；
}否则{
返回null；
}
}
window.oncontextmenu=函数openRightClickMenu（e）{
e、 预防默认值（）；
document.getElementById（“rmenu”）.style.display=“block”；
document.getElementById（“rmenu”）.style.top=mouseY（e）+“px”；
document.getElementById（“rmenu”）.style.left=mouseX（e）+“px”；
document.getElementById（“rmenu”）.classList.add（“打开”）；
window.event.returnValue=false；
}
//删除鼠标右键单击菜单
document.onmousedown=功能移除灯单击菜单（e）{
如果（e.which==1）{
if（document.getElementById（“rmenu”）.classList==“opened”）{
document.getElementById（“rmenu”）.classList.remove（“打开”）；
document.getElementById（“rmenu”）.style.display=“无”；
}
}  
}
// ???
document.getElementById（'rmenu'）。addEventListener（“单击”，函数（）{
功能whatToDo（e）{
如果（e.target.id=='start'）{
log（“单击启动”）
}否则如果（e.target.id=='goal'）{
log（“点击目标”）
}
}
});

如何为动态创建的弹出菜单添加onclick事件

我在网上冲浪，然后创建了addEventListener，但一切都没有改变。我做错了什么

---

我用注释（？？？）

标记了我的问题函数。您使用document.onmousedown隐藏右键单击菜单 首先，事件将应用于整个文档，这意味着无论您在哪里单击弹出窗口，弹出窗口都将变为不可见 其次，它将采取右键单击、左键单击和鼠标滚动按钮作为事件触发，而不仅仅是右键单击

功能鼠标器（evt）{
如果（evt.pageX）{
返回evt.pageX；
}else if（evt.clientX）{
返回evt.clientX+（document.documentElement.scrollLeft？
document.documentElement.scrollLeft：
document.body.scrollLeft）；
}否则{
返回null；
}
}
功能鼠标（evt）{
如果（evt.pageY）{
返回evt.pageY；
}else if（evt.clientY）{
返回evt.clientY+（document.documentElement.scrollTop？document.documentElement.scrollTop:document.body.scrollTop）；
}否则{
返回null；
}
}
window.oncontextmenu=函数openRightClickMenu（e）{
e、 预防默认值（）；
document.getElementById（“rmenu”）.style.display=“block”；
document.getElementById（“rmenu”）.style.top=mouseY（e）+“px”；
document.getElementById（“rmenu”）.style.left=mouseX（e）+“px”；
document.getElementById（“rmenu”）.classList.add（“打开”）；
window.event.returnValue=false；
}
//删除鼠标右键单击菜单
/*document.getElementById（'rmenu'）。addEventListener（“dblclick”，函数（e）{
document.getElementById（'rmenu'）.style.display=“无”；
});
*/
document.documentElement.addEventListener（“单击”），函数（e）{
document.getElementById（'rmenu'）.style.display=“无”；
});
// ???
document.getElementById（'rmenu'）。addEventListener（“单击”，函数（e）{
e、 停止传播（）；
功能whatToDo（e）{
如果（e.target.id=='start'）{
log（“单击启动”）
}否则如果（e.target.id=='goal'）{
log（“点击目标”）
}
}
});
document.getElementById（'start'）。addEventListener（“单击”），函数（e）{
e、 停止传播（）；
log（“单击启动”）；
});
document.getElementById（'goal'）。addEventListener（“单击”），函数（e）{
e、 停止传播（）；
log（“点击目标”）；
});
.rmenu\u选项{
边缘底部：7px；
光标：指针；
}
#rmenu{
显示：无；
位置：绝对位置；
背景：bisque；
宽度：175px；
高度：55px；
填充：10px；
边界半径：6px；
字号：18px；
}

您想创建尽可能多的弹出窗口吗？iliasse否，只有一个。您可以通过左键单击某个位置而不是在弹出窗口上，而不是双击来更改代码以隐藏弹出窗口吗？抱歉，伙计，延迟了，您的答案已更新为新行为！