Bootstrap 进度条只触发到一半

如何解决Bootstrap 进度条只触发到一半

我有以下引导进度条：

<div class="progress">
    <div class="progress-bar progress-bar-warning" aria-valuemax="100" role="progressbar">
        <p id="Progresspresentage"></p>
    </div>
</div>

每次调用 setInterval 函数时，我都会通过将宽度增加 10 来使用 startProgressBar 函数为进度条设置动画：

function startProgressBar() {
    percentVal += 10;
    progressBar.css("width",percentVal + '%');
    if (percentVal == 100) {
        percentVal = 0;
    }
}

我确实在 SignalR hub.client 代码块中使用了 setInterval，如下所示：

hub.client.SendAsync = function (status) {
    switch (status) {
        case "Adding":
            $("#DataProgress").text("Processing Data");
            document.getElementById("btnsubmit").disabled = true;
            intervalId = window.setInterval(startProgressBar,1);
            break;
    }
}

然后我在收到从 sginalR 完成的消息后执行 clearInterval(intervalId);。 intervalId 在我的代码开头预定义为 int。代码似乎运行良好，直到达到 60% 或 50%，然后它不再向前移动。一旦我调试了代码并逐行进入代码行，进度条就会完成，直到结束并再次回滚到零并且工作正常。那么我的代码有什么问题，为什么进度条只能到达一半。

hub.client.SendAsync = function (status) {
    switch (status) {
        case "Completed":
            clearInterval(intervalId);
    }
}

控制器：

using (var client = new HttpClient())
{
    var postTask = client.PostAsJsonAsync<DataStructure>("https://localhost:44320/api/values",dataStructure);
    context.Clients.All.SendAsync("Adding");
    postTask.Wait();
    if(postTask.Result.IsSuccessstatusCode)
    {
        context.Clients.All.SendAsync("Completed");
    }
}