JavaScript catch onfocus事件

Question

我有一些输入和一个按钮。我想实现一个功能，允许删除最近关注/关注的输入之一。

我设置了onfocusout函数，该函数设置了一个打开按钮的单击侦听器。如果我将焦点放在第一个输入上，然后将焦点移出，然后单击按钮--效果很好。但是当我专注于第一个输入，然后点击第二个按钮时-我得到了deleteCell()函数被执行了n次，我聚焦了出来。

如何让它只记住上一次的onfocusout事件？它似乎会在点击按钮之前统计我的onfocusout事件。

谢谢。

var input = document.createElement("input");
input.setAttribute("onfocusout", "myFunction()");

function myFunction() {
    document.getElementById("delete-cell").addEventListener("click", function () {
        deleteCell();
    });
}

function deleteCell() {
    alert(1);
}

Answer 1

尝试向相关的元素类添加一个焦点输出侦听器，然后为元素焦点输出添加一个" to -delete“类(使用"this”属性)。但是只有在您首先从所有元素中删除这个"to-delete“类之后，才能添加它。这将使您能够继续访问与最近的focusout事件相关的元素。

 $(".element-class").on("focusout", function() {
     $(".element-class").removeClass("to-delete");
     $(this).addClass("to-delete");
 })

然后，只需编写一个函数，该函数将删除由on-click事件触发的带有"to- delete“类的元素。

这里是fiddle：https://jsfiddle.net/gbrodzik/ej4czqrc/6/