Question

我试图在进度条脚本上做一些非常简单的事情但是我不存在的javascript知识让我有点挣扎。

我看起来像这样：

if (progress == 100) {
    var element = document.getElementById("avatar-progress");
    element.classList.add("finish");
    setTimeout(function () {
        $('#avatar-progress').circleProgress(
            'value',
            0
        );
    }, 250);
                }

if ($('#avatar-progress').circleProgress('value') == 0) {
    var element = document.getElementById("avatar-progress");
    element.removeAttribute("class");
}



$('#avatar-progress').circleProgress({
    value: 0,
    size: 156,
    fill: { color: "#60bcff" },
    emptyFill: "#ffffff",
    thickness: 2,
});

基本上这个进度条会发生什么：

当上传达到100％时：将一个类添加到＃avatar-progress以获得一个很酷的脉冲效果，然后，在所需的脉冲动画延迟之后，将该值设置回0，使得进度条消失，并准备好下次上传。

然而，为了剧本的缘故，我必须等待在删除课程之前将值返回到0（如果我不想让脉冲动画再次加载）。

这就是我没有做到的，我不知道怎么写它，正如你在我的代码中看到的那样我尝试了一些东西：

if ($('#avatar-progress').circleProgress('value') == 0) {
    var element = document.getElementById("avatar-progress");
    element.removeAttribute("class");
}

但我的病情不起作用。我正在寻找一些帮助，以正确的方式写这条线。感谢您的建议

Answer 1

您实际上可以在setTimeout函数中执行这两项操作：

if (progress === 100) {
  var element = document.getElementById('avatar-progress');
  element.classList.add('finish');
  setTimeout(function () {
    $('#avatar-progress').circleProgress('value', 0);
    element.classList.remove('finish');
  }, 250);
}

N.B。不要忘记在JavaScript中使用三等号（===），以确保您的比较正确。

参数/变量值的JS条件？

1 个答案: