js addeventlistener：对dragenter使用捕获，但不适用于输入元素

Question

我在保存输入项的容器div上有一个 dragenter 的事件侦听器。但它仅适用于父 div，如果将鼠标悬停在输入上，则会触发 dragleave 事件。捕获是否意味着输入正在触发父事件？

下面添加了事件监听器。

addDragStartListen: function(){
        var fields = document.querySelectorAll('.formFieldType');
        [].forEach.call(fields, function(field) {
            field.addEventListener('dragstart', FORMBUILD.DragStart, true);
        });

        var DItems = document.querySelectorAll('.f-row');
        [].forEach.call(DItems, function(DItem) {
            DItem.addEventListener('dragenter', FORMBUILD.DragEnter, false);
            DItem.addEventListener('dragover', FORMBUILD.DragOver, true);
            DItem.addEventListener('dragleave', FORMBUILD.DragLeave, false);
            DItem.addEventListener('drop', FORMBUILD.DragDrop, false);
        });



    },

当您将元素拖到输入上时，draglet会被触发，请参阅此处以获取显示问题的代码。http://codepen.io/ambrosedheffernan/pen/PPqdMd

注意:codepen中的代码在dragenter上有remove listener，在dragleave上有addlistener。

我正在测试铬，这应该支持捕获，但为什么我不能为输入执行此操作？默认情况下，是否有其他事件优先？

Answer 1

捕获意味着事件将从父项触发到子项。在你的情况下，我认为当你将项目拖到容器，然后拖到它的子输入时，dragenter和dradraleave会被触发容器，dragenter会触发输入。

作为一个想法，您可以创建一个变量来保存实际的拖动进入/离开状态，即当＜code＞dragenter