1

在我的代码中，函数 displayUserTable 将一些名为 tUserBlock 的 div 附加到名为 centralWindow 的主 div 中。当您单击 tUserBlock 时，会从 tUserBlock.onclick 函数中弹出一个名为 userTableClickListener 的 div。我希望能够在您单击它时关闭该弹出窗口，因此我添加了一个名为 userPopupClick 的 onclick 函数，其中包含以下代码：

this.parentNode.parentNode.removeChild(this.parentNode);

但是当它被点击时，centralWindow div（主 div）和所有内容一起消失了。但我只想隐藏弹出 div。我不确定我做错了什么？

这是代码，弹出部分朝向底部：

function displayUserTable() {

    var tTop = 15;
    var tUserBlock = [];

    for (var z = 0; z < (UserData.length); z++) {

        tUserBlock[z] = document.createElement('div');
        tUserBlock[z].className = 'usertable_item';
        tUserBlock[z].id = ('userblock' + z);
        tUserBlock[z].style.width = "388px";
        tUserBlock[z].style.height = "35px";
        tUserBlock[z].style.top = tTop + "px";
        tUserBlock[z].style.left = "25px";
        tUserBlock[z].userID = z;

        tUserBlock[z].onclick = userTableClickListener;

        centerWindow.appendChild(tUserBlock[z]);
    }
}

function userTableClickListener() {
    var tID = this.userID;

    var tPopup = document.createElement('div');
    tPopup.className = 'usertable_popup';
    tPopup.id = 'usertable_popup';
    tPopup.onclick = userPopupClick;

    centerWindow.appendChild(tPopup);
}

function userPopupClick() {
    this.parentNode.parentNode.removeChild(this.parentNode);
}
4

1 回答 1

3

看来您可以这样做（假设centerWindow在范围内）：

centerWindow.removeChild(document.getElementById('usertable_popup'));

您当前方法的问题是您在 DOM 层次结构上上升了一个额外的级别。弹出窗口添加了centerWindow.appendChild(tPopup);，因此您有：

centerWindow
    popup

但是当你试图删除它时，你正在做：

  this.parentNode.parentNode.removeChild(this.parentNode)
//  ^       ^          ^                         ^
//  |       |          body?                     centerWindow
//  |       centerWindow
//  popup
于 2013-09-28T16:42:57.593 回答