javascript - 上下文菜单 CSS 和事件部分工作

Question

我的上下文菜单有点问题，CSS 不适用，点击事件也不起作用。如果我使用 F12(在 IE 11 上)检查元素，我可以看到 CSS 在页面上(在标题中)并且我可以看到上下文菜单的所有行都有点击事件但它不起作用我点击。

CSS:

.ctxmenu
{
    position: absolute;
    height: auto;
    padding: 0px;
    margin: 0;
    margin-left: 0.5em;
    margin-top: 0.5em;
    border: 1px solid black;
    background: #F8F8F8; 
    z-index: 11;
    overflow: visible;
}

.ctxline
{
    display: block;
    margin: 0px;
    padding: 2px 2px 2px 8px;
    border: 1px solid #F8F8F8; 
    overflow: visible;
}

.ctxline:hover
{
    border: 1px solid #BBB;
    background-color: #F0F0F0;
    background-repeat: repeat-x;
}

对于contextMenu的构成:

for (i = 0; i < listCorrection.length; ++i) {
    var p = document.createElement('p');
    d.appendChild(p);
    p.setAttribute('class', 'ctxline');
    p.setAttribute('onclick', 'alert("do something");');
    p.innerText = listCorrection[i];
}

当我检查这个上下文菜单的元素时，我可以看到:

<p onclick="alert("do something");" class="ctxline">set</p>

和包含上下文菜单的 div :

<div id="ctxmenu1" style"CURSOR: pointer" class="ctxmenu">(the p on context menu are here)</div>

有人知道为什么吗？我尝试用 a 将其移动到页眉内，但它仍然无法正常工作。

Answer 1

好吧，在这个问题上花了几个小时后，我可能找到了解决办法，如果有一天有人最终来到这个页面，试试这个:

替换像这样的每一行:

p.setAttribute('class', 'ctxline');

像这样:

p.className = 'ctxline';

我知道这是同一件事，但 IE 很好，所以有时你必须跳出框框思考(此修复适用于 IE11、IE9，我没有使用其他 Navigator 进行测试)。