如何重复onclick事件

How to repeat onclick event?

本文关键字:事件 onclick 何重复      更新时间:2023-09-26

在下面的代码中,如果我再次点击它,为什么它不把球的颜色改回红色?

<!DOCTYPE html>
<html>
<body>
<script>
function farbe1(){
    var stern_style = document.getElementById('kugel1').style;
    var click;
   if(click != 0){
    stern_style.setProperty('fill','#F57200');
    click = 0;
    }
    else if(click == 0){
    stern_style.setProperty('fill','red');
    click = 1;
   }}
</script>
<svg height="2000" width="2000">
<circle id="kugel1" cx="1050" cy="500" r="50" style="fill:red;" onclick="farbe1()" />
</svg>
</body>
</html>

我(正如你可能看到的)是一个初学者,希望得到一些帮助。

因为您的标志在调用时被重置,所以将其移出功能:

var click=0;
function farbe1(){
   var stern_style = document.getElementById('kugel1').style;    
   if(click != 0){
      stern_style.setProperty('fill','#F57200');
      click = 0;
    }
    else if(click == 0){
      stern_style.setProperty('fill','red');
      click = 1;
    }
}

在函数之外定义var click;

var click;
function farbe1(){
var stern_style = document.getElementById('kugel1').style;
if(click != 0){
stern_style.setProperty('fill','#F57200');
click = 0;
}
else if(click == 0){
stern_style.setProperty('fill','red');
click = 1;
}}

这是因为您在farbe1()函数中声明了click。因此,在每次新调用时都将其设置为undefined,并且永远无法访问click == 0