Question

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

<!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>

我（你可能已经看到）一个初学者，并希望得到一些帮助。

Answer 1

因为你召回时你的旗帜会被重置，所以将它移出功能：

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;
    }
}

Answer 2

在函数

之外定义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;
}}

Answer 3

那是因为你在click函数中声明了farbe1()。因此，在每次新调用时都设置为未定义，并且永远无法访问click == 0。

如何重复onclick事件？

3 个答案: