时间戳

首页 > 解决方案 > 在 HTML 中制作 onclick 函数来执行 2 个功能

javascript - 在 HTML 中制作 onclick 函数来执行 2 个功能

问题描述

所以这是我正在做的代码

<a onclick="setStyleSheet('css/blue.css')" href="#">Switch</a>
<a onclick="setStyleSheet('css/red.css')" href="#">Switch</a>

单击它会切换到蓝色主题。但我想保持按钮不变。而不是使用 2 个按钮。我只想将一个 Switch 按钮变为蓝色，然后如果我再次单击该按钮，它将变为红色。有没有办法做到这一点？提前谢谢大家！

标签： javascripthtmlcssonclick

解决方案

您可以设置全局标志

window.blueTheme = true
function setStyleSheet() {
    var styleSheetToBeSet = window.blueTheme ? "css/red.css" : "css/blue.css"
    window.blueTheme = !window.blueTheme

    // your code here
}

当然，您可以将 blueTheme 更改为主题并存储主题名称而不是布尔变量。

然后只调用不带参数的函数：

<a onclick="setStyleSheet()" href="#">Switch</a>

推荐阅读