При изменении ввода введите все входные значения в метку div и update

Есть несколько проблем:

  1. elif option == 2:, а последующий elif - else должен быть выровнен со вторым if option == 1, а не с for.
  2. В for x in range(x, 1, 1): отсутствует тело.
  3. Поскольку для параметра «1 (счет)» требуется второй вход, вам необходимо вызвать input() во второй раз. Однако, для здравого смысла, я призываю вас сохранить результат во второй переменной, а не повторять option.
  4. Сравнение в первой строке вашего кода, вероятно, должно быть назначением.

Когда вы сможете запустить свой код, вы обнаружите больше проблем (вам понадобится еще несколько вызовов input(), один из вызовов range() будет нуждаться в внимании и т. д.).

Наконец, пожалуйста, не используйте ту же переменную, что и переменная цикла, и как часть начального / конечного условия, как в:

            for x in range(1, x, 1):
                print x

Это может сработать, но это очень запутанно читать. Дайте переменной цикла другое имя:

            for i in range(1, x, 1):
                print i
1
задан Daniel James 13 July 2018 в 10:11
поделиться

5 ответов

Вы можете создать массив из входов с использованием методов map и get, а затем вычислить сумму с помощью метода reduce.

let inputs = $('.filters input');
let label = $('.filter-label');

inputs.on('input', function() {
  let sum = inputs.map(function() {
    return $(this).val()
  }).get().reduce((r, e) => r + +e, 0);

  label.text(sum)
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="filters">
  <div class="filter-label">6</div>
  <div class="filter-inputs">
    <input type="number" name="i1" id="i1" value="1" min="0" step="1" />
    <input type="number" name="i2" id="i2" value="2" min="0" step="1" />
    <input type="number" name="i3" id="i3" value="3" min="0" step="1" />
  </div>
</div>

Или вы можете просто создать массив с помощью метода Array.from, а затем использовать метод reduce для суммирования значений.

let inputs = $('.filters input');
let label = $('.filter-label');

inputs.on('input', function() {
  label.text(Array.from(inputs).reduce((r, {value}) => r + +value, 0))
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="filters">
  <div class="filter-label">6</div>
  <div class="filter-inputs">
    <input type="number" name="i1" id="i1" value="1" min="0" step="1" />
    <input type="number" name="i2" id="i2" value="2" min="0" step="1" />
    <input type="number" name="i3" id="i3" value="3" min="0" step="1" />
  </div>
</div>

1
ответ дан Nenad Vracar 17 August 2018 в 13:10
поделиться
  • 1
    Я думаю, вам нужно указать, что входной номер типа позволяет вставить = входные данные $ ('. Filters input [type = "number & quot;]'); – mbadeveloper 13 July 2018 в 10:25

Попробуйте использовать следующий подход:

$(document).ready(function() {
  var total=0;
  $("input[type='number']").change(function() {
    $(".results").html("");
    var objects = $(".filters").find("input[type='number']");
    for (var i = 0; i < objects.length; i++) {
      total += parseInt($(objects[i]).val());
    }
    $(".filter-label").text(total);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="filters">

  <div class="filter-label">6</div>

  <div class="filter-inputs">

    <input type="number" name="i1" id="i1" value="1" min="0" step="1" />
    <input type="number" name="i2" id="i2" value="2" min="0" step="1" />
    <input type="number" name="i3" id="i3" value="3" min="0" step="1" />

  </div>

</div>

0
ответ дан Charu Maheshwari 17 August 2018 в 13:10
поделиться

Вам не нужен jQuery для этой задачи http://jsfiddle.net/72e3jLc0/

  let label = document.querySelector('.filter-label');
  let inputs = document.querySelectorAll('.filter-inputs input');
  inputs.forEach(input => {
      input.addEventListener('change', e => {
          label.innerText = parseInt(label.innerText) + parseInt(input.value);
      });
  }); 
0
ответ дан MyMomSaysIamSpecial 17 August 2018 в 13:10
поделиться

Нет проблем!

$('.filter .filter-inputs input').on('input', function() {

    //not needed:
    //var element = $(this);

    // Obtain numeric entries
    var i1 = Number($("#i1").val());
    var i2 = Number($("#i2").val());
    var i3 = Number($("#i3").val());

    // Calculate sum of entries
    var total = i1 + i2 + i3;

    // Populate label div with sum
    $(".filter-label").html(String(total));
});

Удачи!

0
ответ дан Pancake 17 August 2018 в 13:10
поделиться
  • 1
    вы должны объяснить свой код, чтобы OP понимал проблему – ThisGuyHasTwoThumbs 13 July 2018 в 10:17
  • 2
    Спасибо за предложение, я обновил свой ответ с пояснительными комментариями – Pancake 13 July 2018 в 10:21

Используйте этот скрипт

$('.filter-inputs input').change(function(){
    var total = 0;
    $('.filter-inputs input').each(function(){

        total += parseInt($(this).val());
    });

   $('.filter-label').html(total);
});
0
ответ дан Rahul kalal 17 August 2018 в 13:10
поделиться
Другие вопросы по тегам:

Похожие вопросы: