javascript - 如何删除由多个子元素组成的主父元素？

Question

HTML -

    <div class="windows" id="window'+divCount+'"> 
<p id="windowName'+divCount+'"></p> 
<p id="para'+divCount+'">Source</p> 
</div> 
<div class="windows" id="window'+divCount+'"> 
<p id="windowName'+divCount+'"></p> 
<p id="para'+divCount+'">Source</p> 
</div> 
<div class="windows" id="window'+divCount+'"> 
<p id="windowName'+divCount+'"></p> 
<p id="para'+divCount+'">Source</p> 
</div> 
<div class="windows" id="window'+divCount+'"> 
<p id="windowName'+divCount+'"></p> 
<p id="para'+divCount+'">Source</p> 
</div>

 

JAVASCRIPT -

$.contextMenu({
      selector: ".windows",
      selectableSubMenu: true,
      callback: function(key, options) {
        var m = "clicked: " + key;
        window.console && console.log(m) || alert(m);
      },
      items: {
        "delete": {
          name: "Delete",
          callback: function() {
            $('<div style="font-family:Poppins;" title="Delete Window"> <p></span>This window will be permanently deleted and cannot be recovered. Are you sure?</p></div>').dialog({
              resizable: false,
              height: "auto",
              width: 400,
              modal: true,
              buttons: {
                Cancel: function() {
                  $(this).dialog("close");
                },
                "Delete": function() {
                  $(this.parentNode).remove();
                },
              }
            });
    
          }
        },
    
        "sep1": "---------",
    
        "SB": {
          name: "Send Back",
          callback: function() {
            var index = $(this).css("z-index");
            if (index != 50) {
              index = parseInt(index) - 50;
              $(this).css("z-index", index);
            } else {
              $(this).css("z-index", "50");
            }
          }
        },
    
        "SF": {
          name: "Bring Front",
          callback: function() {
            var index = $(this).css("z-index");
            index = parseInt(index) + 50;
            $(this).css("z-index", index);
          }
        },
    
        "Du": {
          name: "Duplicate",
          callback: function() {
            $(this).attr("Window" + 1);
            $(this).clone().appendTo(container);
          }
        },
    
        "Edi": {
          name: "Edit",
          callback: function() {
    
          }
        }
      }
    });

在上面的代码中，divcount是创建的窗口计数。我在上下文菜单中使用上下文菜单进行个别更改需要div class="windows"，在上下文菜单中我使用了 jQueryDialog小部件，当我在对话框中单击删除时，我只想remove()右键单击的 div/窗口而不是全部，我试过了this.parentElement但这会删除上下文菜单而不是 Div... 我如何定位并删除右键单击的 div？

标签： javascriptjquery