在javascript中使用事件时是否可以完全忽略子级？

我一直在工作的任务组织网站上工作，我遇到了一个障碍。我正在尝试创建一个可以容纳卡片的容器（类似于trello的工作方式）。我已经设法让这些卡正确地拖放，并且它的工作原理与它应该的一样。但是，我的问题是，当一张卡被拖动的卡悬停在上面时，会出现一个。我设计了一个指示灯，当进入下降目标时，它就会启动。在输入放置目标中的子元素之前，此操作一直有效。一旦发生这种情况，指示器就会崩溃，只有当您退出卡并重新输入时（假设您没有输入子元素），指示器才会得到修复

所以，我需要的是一种忽略子元素而只看到父元素的方法。我尝试了各种方法，在孩子们接触到它们之前停止捕捉和冒泡，但这没有帮助。孩子们仍然强迫持有的卡片相信它离开了下降目标

因为我的代码相当长，所以我将只包含javascript中的几行代码。请记住，我对web开发还不太熟悉，所以我的javascript可能没有遵循最佳实践。最初，代码得到了更好的维护，看起来也更漂亮，但由于我尝试了很多忽略孩子的方法，代码变得有点忙乱

无论如何，任何指点都会很棒。提前谢谢

函数addListeners（卡）
{
//获取内部卡并添加侦听器。
card.draggable=true；
card.style.cursor='pointer'；
$（卡片）.on（'click'，card，function（）{editCard（card）}）；
card.addEventListener（'dragstart'，dragstart，false）；
卡片.添加列表器（'dragend'，dragend，false）；
卡片.添加列表器（'dragenter'，dragenter，false）；
卡片。添加的监听器（'dragover'，dragover，false）；
卡片.添加列表器（'dragleave'，dragleave，false）；
卡片.添加列表器（'drop'，dragDrop，false）；
//event.currentTarget！==event.target
回程卡；
}
函数dragStart（）
{
originalClassname=this.className；
this.className+='holding'；
this.id=‘拖卡’；
previousStyle=this.parentNode.style.display；
setTimeout（（）=>（this.parentNode.style.display='none'），10）；
}
函数dragEnd（）
{
this.className=原始className；
this.parentNode.style.display=previousStyle；
}
功能性疏水剂（e）
{
控制台日志（“输入”）；
var enteredElement=e.currentTarget.parentNode；
var dropIndicator=enteredElement.querySelector（“dropIndicator”）；
dropIndicator.className+=“指示器处于活动状态”；
}
函数dragOver（e）
{
e、 预防默认值（）；
}
函数dragLeave（e）
{
console.log（e.currentTarget.parentNode）；
如果（e.currentTarget.parentNode===enteredElement）
{
var dropIndicator=e.currentTarget.parentNode.querySelector（“#dropIndicator”）；
dropIndicator.className='dropIndicator'；
}
其他的
{
log（“仍在元素中”）；
}
}
函数dragDrop（e）
{
e、 预防默认值（）；
var dropIndicator=e.currentTarget.parentNode.querySelector（“#dropIndicator”）；
var draggedCard=document.getElementById（'dragged-card'）；
insertBefore（draggedCard.parentNode，this.parentNode）；
dropIndicator.className='dropIndicator'；
draggedCard.id=''；
}

一些注释。这些卡是动态创建的，并成为任务列表的父级。那张卡片的结尾是这样的：

东西
Thangs

---

带有类卡的内部卡被传递给事件侦听器函数。

您可能需要创建一个小提琴来显示问题。另外，您是否正在所有卡上使用

id

s（如

下拉指示器

，

卡标签

，

卡标题

，以及

卡说明

）？也许这些应该是类？我肯定应该也将要做很多重构，但目前，除非手头的问题需要重构，否则我不会担心重构。您知道是否可以使事件完全忽略子节点？您可以在事件处理程序中手动检查目标是父节点，而不是任何子节点。您可以通过检查父级是否具有子级不具有的属性（例如，类名）来执行此操作。如果您有多张卡，则必须使每张卡的id唯一。这不是重构，而是很可能增加了您的问题。ID在每页上只能使用一次。@FrankFajardo，好吧，这就是为什么你和克隆人都提到ID的原因。假设我使卡id唯一，我可以简单地检查孩子的父id是否等于currentTarget。这是我以前尝试过的，但如果我添加唯一的ID，可能会更容易。