Javascript 我的函数只运行一次

我希望我的按钮将文本区域中的文本剪切到剪贴板，然后 每次单击按钮时，该按钮都会同时旋转。我明白了 工作，但它只旋转一次，下次我单击它时，它将剪切 文本按钮不会旋转

HTML 我的按钮和文本区

<div class="box-2-wrap">

<textarea class="out-put"></textarea>

<button type="button" id="copyEmailsButton" onclick="copyEmails()">Copy Emails</button>

</div>

JS 我的JavaScript

function unSelectAll(){
        var output = document.getElementsByClassName("out-put")[0];
            output.innerHTML = "";
    }
}

function copyEmails(){
    var output = document.getElementsByClassName("out-put")[0];
        output.select();
        document.execCommand('copy');
        unSelectAll();
    var copyEmailsButton = document.getElementById("copyEmailsButton");

    if (copyEmailsButton.style.animation !== "rotate 1s") {
        copyEmailsButton.style.animation = "rotate 1s";
    }else{
        copyEmailsButton.style.animation = "none";
    }
}

---

在copyEmails中的if-else块中，指定如果动画样式未设置为“旋转1s”，则按钮将旋转1秒。但如果是，它只会将动画样式设置为“无”

如果你第三次点击这个按钮，你将不会再看到它再次旋转。这是因为在第二次单击时，已将动画样式再次设置为“无”

这意味着，您的按钮将切换和旋转每2次点击

要使按钮在每次单击时旋转，请将“如果其他”块更改为：

copyEmailsButton.style.animation = "rotate 1s";
setTimeout(function() {
copyEmailsButton.style.animation = "none" 
}, 1000);

---

这将在动画完成后，每次单击按钮时再次将动画样式设置为“无”。

1您的

取消播放功能中有错误，应删除一个额外的关闭

2在下一次单击之前重置按钮样式，如下例所示


function unSelectAll（）{
var output=document.getElementsByClassName（“输出”）[0]；
output.innerHTML=“”；
}
函数copyEmails（）{
var output=document.getElementsByClassName（“输出”）[0]；
output.select（）；
document.execCommand（'copy'）；
取消选择全部（）；
var copyEmailsButton=document.getElementById（“copyEmailsButton”）；
如果（copyEmailsButton.style.animation！=“旋转1s”）{
copyEmailsButton.style.animation=“旋转1s”；
}否则{
copyEmailsButton.style.animation=“无”；
}
}
.box-2-wrap{
宽度：100%；
身高：100%；
显示器：flex；
弯曲方向：立柱；
边框：0px实心#333；
}
.box-2-wrap文本区域{
弹性：1；
填充：4%；
溢出y：自动；
背景色：#333；
颜色：金色；
最大宽度：100%；
最小宽度：100%；
字体大小：110%；
边界：无；
边界半径：8px；
}
.box-2-wrap按钮{
对齐项目：柔性端；
证明内容：中心；
填充：10px2%；
宽度：50%；
利润率：6%；
背景色：#178E44；
颜色：白色；
字体大小：120%；
边界：无；
边界半径：4px；
}
@关键帧旋转{
0% {
变换：旋转（0度）；
}
50% {
变换：旋转（360度）；
}
100% {
变换：旋转（0度）；
}
}

复制电子邮件

copyEmailsButton.style.animation = "rotate 1s";
setTimeout(function() {
copyEmailsButton.style.animation = "none" 
}, 1000);