Javascript 单击后前后更改html按钮的背景色

我不熟悉JavaScipt和HTML，只需要把它作为一个次要问题。我有一些按钮，我想他们的背面颜色改变后点击。我可以通过以下方式部分解决：

---

我将您的代码分解为单独的JS，这样更干净，更易于维护

如果禁用该按钮，则它将停止接收单击事件。我想那不是你想要的

在这里，我做了这样的设置，当点击按钮时，它会在红色和蓝色之间切换背景色

编辑

在这里，作为一个班轮：

---

您可以通过纯javascript在类名之间使用toggole

HTML:

<button id="toggole" class="red" onclick="toggolecolor()">
Click Please
</button>

function toggolecolor(){
 var element = document.getElementById("toggole");
  element.classList.toggle("red");
    element.classList.toggle("blue");

}

Javascript:

<button id="toggole" class="red" onclick="toggolecolor()">
Click Please
</button>

function toggolecolor(){
 var element = document.getElementById("toggole");
  element.classList.toggle("red");
    element.classList.toggle("blue");

}

---

如果它被禁用，应该如何再次单击？您是否尝试在第二次单击时启用该按钮？有点不清楚。@nicael Sry，忘了把这个拿出来。我应该没有

this.disabled=true

。编辑以删除此。disabled=true；根据用户的评论。Thx，但是你确定它工作正常吗？对我来说，按钮一直是红色的。难道没有“一线解决方案”吗？我更愿意这样做，因为包含这些按钮的html文档将使用一些模板引擎（jinja2）构建，到目前为止，我在其中插入JavaScript函数时遇到了麻烦。我也无法导入JavaScript文件。它必须已经写入html document.Hi中。欢迎来到StackOverflow。请注意，这不是有效的html。您需要正确关闭标记。例如，缺少

。此外，

bgcolor

也不推荐使用。此外，请阅读：

function toggolecolor(){
 var element = document.getElementById("toggole");
  element.classList.toggle("red");
    element.classList.toggle("blue");

}