javascript - 在 html 中将 'onclick' 用于仅工作一次的 javascript 函数

Question

非常简单，我正在尝试创建一种方法来滑出 div并通过 clicking 使其可见webpage 上的一个按钮.我的 css 和布局看起来正确，animation运行一次，但随后不再运行。

这是完整的js文件

var button1Toggle;
var button2Toggle;
var button3Toggle;

button1Toggle = false;

function slideOutFunc() {
    if (button1Toggle == false) {
        document.getElementById('fade-in1').style.left = '0';
        document.getElementById('fade-in1').style.opacity = '1';
        button1Toggle = true;
    } else {
        document.getElementById('fade-in1').style.left = '-33vw';
        document.getElementById('fade-in1').style.opacity = '0';
        button1Toggle = true;
    }
}

<button id="clickApply" class="applyButton" onclick="slideOutFunc()"><a>Apply</a></button>

这是 html portion调用函数

任何有助于理解为什么它只工作一次的帮助将不胜感激。

Answer 1

sildeOutFunc 中的两个条件都将 buttonToggle 设置为 true