主页 / 问题 / 830369
Accepted
Gonzo
Asked:2020-05-20 03:10:40 +0000 UTC2020-05-20 03:10:40 +0000 UTC

Javascript 关闭问题

  • 772

需要编写一个简单的计数器（例如在线商店购物篮中的商品 + - 用于输入值）。我总是做这样的事情，没有任何问题，一切正常（我简化了它以便本质可见）：

var count = 1;
input.value = count;

next.addEventListener('click', function(){
    if(count < 4) {
        count++;
        input.value = count;
    }
});

prev.addEventListener('click', function() {
    if (count > 1) {
        count--;
        input.value = count;
    }
});

从 1 数到 4。

但是现在我们需要在模态窗口中插入一个计数器，通过点击不同的元素来调用它。计数器将在窗口出现的那一刻被初始化（将计数器放在一个函数中）。乍一看，一切正常，一切切换，当您关闭窗口并调用另一个窗口时，字段值设置为 1（如第一行所示），但是如果您在计数器出现后立即单击后退按钮对于第二次 ++ 时间（如果前一个窗口在大于 1 的数字上关闭），则它从最后一个窗口关闭时的值开始倒数，忽略if(count>1)，就好像 count 正在保存前一个窗口中的值，尽管理论上我在第一行专门将其重新分配为 1 。

我想了解原因是什么，它的工作原理是什么以及如何最好地解决这个问题？

javascript

2 个回答

  1. Best Answer

    问题在于分配事件处理程序的方式。AddEventListener() 可以为单个事件添加多个侦听器。当计数器重新初始化时，另一个类似的处理程序被添加到点击事件中，中断了计数器的正常操作。

    • 2

  2. 您有count一个全局变量，因此它保留其先前的值。出路是让每个函数都本地化

    next.addEventListener('click', function(){
    var count = input.value;
    if(count < 4) {
        count++;
        input.value = count;
    }
});

prev.addEventListener('click', function() {
    var count = input.value;
    if (count > 1) {
        count--;
        input.value = count;
    }
});
    • 0

相关问题