Javascript 基于单击位置的不同值的增量

我想让变量根据我单击的位置递增。然后能够减少点击的位置。但是第一个增量并没有存储在z中，所以当我进行第二个增量时，它不会与第一个增量相加，只会发布第二个增量。我怎样才能使这个增量工作？代码如下：

$（“.pesqopcao”）。单击（函数（）{
var color=$（this.css（“背景色”）；
var z=0；
如果（颜色='rgb（255，255，255）| |颜色='white'）{
$（this.css（“背景色”、“蓝色”）；
z+=（this.id*1）；
document.getElementById（“z”）.innerHTML=z；
}否则
如果（颜色='rgb（0，0，255）| |颜色='blue'）{
$（this.css（“背景色”、“白色”）；
z-（此id*1）；
document.getElementById（“z”）.innerHTML=z；
}
});

101
601
901
您需要在jQuery click事件之外声明变量，以便在两次单击之间保持该变量

此外，第11行的输入错误：您正在从
z
中减去，但没有将其设置为任何值。应该是
z-=
而不是
z-


var z=0；
$（“.pesqopcao”）。单击（函数（）{
var color=$（this.css（“背景色”）；
如果（颜色='rgb（255，255，255）| |颜色='white'）{
$（this.css（“背景色”、“蓝色”）；
z+=（this.id*1）；
document.getElementById（“z”）.innerHTML=z；
}else if（颜色='rgb（0,0255）| |颜色='blue'）{
$（this.css（“背景色”、“白色”）；
z-=（this.id*1）；
document.getElementById（“z”）.innerHTML=z；
}
});

101
601
901

2-将变量声明为函数外部的全局变量（不带var关键字）。
3-$（this）.id未使用jquery api的attr方法定义


$（文档）.ready（函数（）{
z=0；
$（“.pesqopcao”）。在（'click'，function（）上{
var color=$（this.css（“背景色”）；
如果（颜色='rgb（255，255，255）| |颜色='white'）{
$（this.css（“背景色”、“蓝色”）；
z+=parseInt（$（this.attr（'id'））；
document.getElementById（“z”）.innerHTML=z；
}否则{
如果（颜色='rgb（0，0，255）| |颜色='blue'）{
$（this.css（“背景色”、“白色”）；
z-=parseInt（$（this.attr（'id'））；
$（“#z”）.text（z）；
}
}
});
});
.pesqopcao{背景色：白色；}

101
601
901

1-value of z as it is an id so string parseInt it.