Javascript 通过单击增加变量

我有一个画布，我想通过点击增加可变电压。问题是，当我点击时，变量会随机增加。我需要一次点击=变量增加一次

代码如下：

var canvas = document.getElementById("diodeCircuit");
var ctx = canvas.getContext("2d");
var voltage = 0;

function runCanvas() {
  ctx.clearRect(0, 0, canvas.width, canvas.height);
  changeVoltage();
}

function changeVoltage() {
  window.addEventListener("click", doMouseClick, false);

  function doMouseClick(event) {
    x = event.pageX - canvas.offsetLeft;
    y = event.pageY - canvas.offsetTop;
    if (x >= 0 && x <= 1000 && y >= 0 && y <= 400) {
      voltage += 1;
    }
  }

  ctx.fillStyle = "#000";
  ctx.textAlign = "center";
  ctx.font = "30px sans-serif";
  ctx.fillText(voltage + " V", 500, 50);
}

setInterval(runCanvas, 100);

var canvas=document.getElementById（“diodeCircuit”）；
var ctx=canvas.getContext（“2d”）；
无功电压=0；
函数runCanvas（）{
clearRect（0，0，canvas.width，canvas.height）；
改变电压（）；
}
功能转换电压（）{
window.addEventListener（“单击”，doMouseClick，false）；
函数单击（事件）{
x=event.pageX-canvas.offsetLeft；
y=event.pageY-canvas.offsetTop；
如果（x>=0&&x=0&&y
这是每秒调用
runCanvas
函数10次-这是调用
doMouseClick
函数，每秒创建10个单击侦听器，然后通过单击触发每个侦听器

动议如下：

window.addEventListener("click", doMouseClick, false);

在间隔函数之外回调，这样您只需单击一次侦听器。
从
setInterval
中删除
eventListener
并从
setInterval
之外调用它，它会重复地将click eventListener附加到窗口：


var canvas=document.getElementById（“diodeCircuit”）；
var ctx=canvas.getContext（“2d”）；
无功电压=0；
函数runCanvas（）{
clearRect（0，0，canvas.width，canvas.height）；
改变电压（）；
}
函数单击（事件）{
x=event.pageX-canvas.offsetLeft；
y=event.pageY-canvas.offsetTop；
如果（x>=0&&x=0&&y
window.addEventListener("click", doMouseClick, false);