web应用程序中进度条的解决方案

我有一个用html/css/js制作的简单列表应用程序。您键入一个任务，添加它，然后在li元素的页面上显示该任务。如果我选择了一个任务，它会突出显示，我会被带到另一个页面。这个页面上只有一个"完成"按钮。一旦我按下这个按钮，我就会弹出一个弹出窗口，询问我完成了当前任务的多少，范围从1到10，我可以用滑块选择。10表示完成任务的100%。这是我需要帮助的地方。我想要一个进度条来表示我用滑块选择的数字，只用于我在上一页上选择的特定任务。因此，如果我有10个任务，我会选择一个，当我用滑块选择我完成了多少任务（从1到10）时，我选择的特定任务将显示一个进度条，代表我用滑块所选择的内容，而其他任务也不会显示相同的内容。我在想，也许当我添加一个任务时，一个新生成的类可以附加到那个特定的li元素？这就是为什么滑块只能应用表示我为特定任务选择的数字的进度？对不起，如果我说不通的话。我累了。