Question

目前我正在做一个简单的应用程序，我只是访问dom并添加一些eventlisteners，事情是，我有一个应用于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

Answer 1

您在相同的执行上下文中使用相同的名称showModal作为问题。

为什么上下文没有传递给eventlistener

1 个答案: