Question

我正在创建an application，以帮助背包客在旅途中跟踪其花费。

当用户填写表单时，将在页面上创建一个列表组项目，其中包含他们刚提交的信息。该项目还包括用于编辑或删除该项目的链接。

我在删除/编辑功能方面遇到了麻烦。单击删除按钮后，将删除列表组项目。太棒了但是，编辑按钮也可以删除该项目（很棒）。

我有一个事件监听器，它监听对ul元素的点击（第120行）：

document.querySelector('ul').addEventListener('click', itemDeleteSubmit);

这会将事件信息传递给函数（第145行）。该函数有一个if语句，如果类名称为"item-delete"，则触发删除函数（第151行）：

const itemDeleteSubmit = function(e) {

        var itemClicked = e.target.className;

        debugger;

        if (itemClicked = "item-delete") {

            // Delete item from data structure
            ItemCtrl.deleteItem(itemClicked.parentNode.id);

            // Delete item from UI
            UICtrl.deleteListItem(itemClicked.parentNode);
            }
    }

编辑项的类名为"edit-item"，但仍会触发删除功能。

我在第149行的代码中添加了一个调试器。

如果您将其签出，则会看到单击编辑项时，控制台将显示e.target.className = “item-edit”。但是，当您进入下一个函数调用时，e.target.className会变为“item-delete”。

任何人都可以解释为什么会发生这种情况以及我该怎么做才能解决这个问题？

为什么我的<a>元素的className在if语句之后更改？

0 个答案: