javascript - 为什么上下文没有传递给事件监听器

目前，我正在做一个简单的应用程序，我只是访问dom并添加一些事件监听器，问题是，我有一个应用于3个按钮的类，并且我想将事件监听器添加到3个他们，但我想重用一个函数来显示和隐藏模式。

基本上，当我单击其中一个应用了类的按钮时，我想显示模式

所以我做到了：

var showBackdrop = document.querySelector('.backdrop');
var showModal = document.querySelector('.modal');
var confirmationNo = document.querySelector('.modal__confirmation--no')

var planChoices = document.querySelectorAll('.plan__choice');

function showModal() {
    showBackdrop.style.display = 'block';
    showModal.style.display = 'block';
}

function hideModal() {
    showBackdrop.style.display = 'none';
    showModal.style.display = 'none';
}

var ctx = this;
for(planChoice of planChoices) {
    console.log(ctx);
    planChoice.addEventListener('click', function() {

    });
}

confirmationNo.addEventListener('click',function() {
    hideModal();
})

问题是它找不到showModal函数，错误显示，showModal不是函数，为什么？ ：S

最佳答案

您在同一执行上下文中对函数和变量使用了相同的名称showModal，这可能会引起问题。