单击两次onClick事件

Question

是否有可能有一个onClick事件,第一次点击它使用一个功能,第二次点击它使用另一个？

例如

<p id="demo" onclick="goRed(), goBlue()">Click me to change my text color.</p>

<script>
    function goRed() {
        document.getElementById("demo").style.color = "red";
    }
    function goBlue() {
        document.getElementById("demo").style.color = "blue";
    }
</script>

我可以这样做,所以onClick函数首先使用goRed(),然后在第二次点击后使用goBlue()吗？谢谢

Answer 1

只需使用一个功能,但在该功能中的不同颜色之间切换:

function toggleColor() {
  var el = document.getElementById("demo");
  
  if (!el.style.color || el.style.color == "blue")
    el.style.color = "red";
  
  else
    el.style.color = "blue";
}

<p id="demo" onclick="toggleColor()">Click me to change my text color.</p>

color如果元素color当前为"蓝色"或尚未设置,我们将其设置为"红色" .否则我们将其设置为"蓝色".