Форум

Fiks · #1 (**permalink**) 28.09.2017, 21:15

Как подсчитать сумму при вводе в один input, результат во-втором, если уже во-втором есть значение.

$('#SpeedometerOut').keyup(function (e) {
        if( e.keyCode !== 8 && e.keyCode !== 46 ) {
                         var formula = parseFloat($('#SpeedometerOut').val()) + parseFloat($('#SpeedometerReturn').val());
                $('#SpeedometerReturn').val(formula);
        } else {
            if( $('#SpeedometerOut').val() ) {
                formula =  parseFloat($('#SpeedometerReturn').val()) - parseFloat($('#SpeedometerOut').val());
                $('#SpeedometerReturn').val(formula);
            }
        }
    });

То есть на выходе получается:
По умолчанию значение(value) #id1=0, а #id2=10
<input value='1' id='id1'> and <input value='10' id='id2'>
И в конце должно получиться в #id2 = 11
Но так же, если я стираю числа в id1, то в id2 сумма должна меняться.

j0hnik · #2 (**permalink**) 28.09.2017, 21:29

Может нужно три поля?

<!DOCTYPE html>
<html lang="en">
<head>
<style>
	input{
		width: 30px;
	}
</style>
</head>
<body>
	<input type="text">+<input type="text">=<input type="text">
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
	<script>
		$('input').keyup(function(){
			$('input').eq(2).val($('input').eq(0).val()*1+$('input').eq(1).val()*1);
		});
	</script>
</body>
</html>

j0hnik · #3 (**permalink**) 28.09.2017, 21:30

можно и с двумя сделать, то тогда начальное значение второго поля нужно будет хранить например в data. если в value хранить сумма будет постоянно увеличиваться

j0hnik · #4 (**permalink**) 28.09.2017, 21:33

<!DOCTYPE html>
<html lang="en">
<head>
<style>
	input{
		width: 30px;
	}
</style>
</head>
<body>
	<input type="text" value="0"><input type="text" data-val="10" value="10">
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
	<script>
		$('input').keyup(function(){
			$('input').eq(1).val($('input').eq(0).val()*1+$('input').eq(1).attr('data-val')*1);
		});
	</script>
</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript