Jquery — как сделать шкалу, может есть где то готовый скрипт?

Question

азаза @natojezlo

JavaScript

Jquery — как сделать шкалу, может есть где то готовый скрипт?

есть форма, в ней всякие инпуты, селекты и т.п
напр. возьмем 10 штук, которые необходимо заполнить

<input type="text"/><br/>
<input type="text"/><br/>
<input type="text"/><br/>
<input type="text"/><br/>
<input type="text"/><br/>
<input type="text"/><br/>
<input type="text"/><br/>
<input type="text"/><br/>
<input type="text"/>

справа нужна шкала(полоска), которая будет расти в процентном соотношении
т.е если все инпуты заполнены, то соответственно будет 100% высвечивать

Спасибо

Вопрос задан более трёх лет назад
665 просмотров

1 комментарий

Подписаться 2 Простой 1 комментарий

1. Высчитывай процент заполненных полей от общего количества.
2. Закрашивай шкалу на этот процент.

Answer 1 · 2019-10-07 18:04:09

www.jooom.ru/toster/scale-js.html

$(function () {
	$('input[type="text"]').val('');
	$('input[type="text"]').on('change', function () {
		scaleGo();
	});
	function scaleGo() {
		$scale = 0;
		$('input[type="text"]').each(function( index ) {
			if ($(this).val() != '') $scale++;
		});
		$scale = $scale *10;
		$('.scale_info').text($scale+'%');
		$('.scale_inner').css('width', $scale+'%');
	}
});

Jquery — как сделать шкалу, может есть где то готовый скрипт?

Войдите на сайт