Итак, в основном, bootstrap предлагает этот компонент индикатора выполнения на ходу:
<div class = "progress">
<div class = "progress-bar" role = "progressbar" aria-valuenow = "25" aria-valuemin = "0" aria-valuemax = "100"></div>
</div>
Вы можете изменить значение индикатора выполнения через aria-valuenow.
Я сделал это, используя:
let progressbar = document.getElementsByClassName('progress').value();
И затем в моем событии onclick я хочу добавить следующие 25 для каждого текущего шага:
button[1].onclick = () => {
current_step++;
progressbar = progressbar + 25;
let previous_step = current_step - 1;
if (( current_step > 0) && (current_step <= 4)){
button[0].style.display = "inline-block";
step[current_step].style.display = "block";
step[previous_step].style.display = "none";
if (current_step == 4){
button[2].style.display = "inline-block";
}
} else {
if (current_step > 4){
form.onsubmit = () => { return true }
}
}
}
Но этот не сработал, и он не добавляет 25 за каждое добавление шага или нажатие кнопки.
Как я могу это исправить, чтобы на каждом шаге добавлялось 25 единиц одним нажатием кнопки?



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Во-первых, атрибуты «aria» предназначены для доступности. Это атрибут стиля "width", который устанавливает ширину, например style = "width: 25%".
let progressbar = document.getElementsByClassName('progress').value();
В вашем примере элемент с классом «прогресс» - это div без какого-либо атрибута значения.
Вы должны получить текущее значение элемента индикатора выполнения с помощью класса "индикатор выполнения". Затем вы можете увеличить его и установить новое значение для элемента progess-bar.