Использование jQuery для суммирования значений из пары текстовых вводов

Question

У меня есть пара текстовых входов, и я хотел бы вычислить сумму значений в другом входе.Это должно происходить на лету, как только пользователь вводит значение в один из входов.Я планирую использовать jQuery для этого, и я хотел бы добавить имя класса для каждого ввода, что-то вроде class = "input1", class = "input2" и т. Д.Я не знаю, как добавить все эти значения, и учитывая тот факт, что у меня более 50 входов, я не хочу «добавлять их вручную».

Любая помощь приветствуется.

Answer 1

Если вы украсите все входы, которые хотите добавить, вместе с классами input1, input2 и т. Д., То получите сумму текущих значений во всех этих входах

var sum = 0;

$("input[class *= 'input']").each(function(){
    sum += +$(this).val();
});

Естественно, если вы хотите поместить это значение во входные данные id destination

$("#destination").val(sum);

Вот скрипка

РЕДАКТИРОВАТЬ

Если вы хотите, чтобы это запускалось всякий раз, когда любое из этих текстовых полей изменено , то вы можете поместить это в обработчик события изменения

$(document).on("change", "input[class *= 'input']", function() {
    var sum = 0;

    $("input[class *= 'input']").each(function(){
        sum += +$(this).val();
    });

    $("#destination").val(sum);
});

Вот эта скрипка

РЕДАКТИРОВАТЬ

За комментарий Jaspers, если вы знаете, что input1, input2 и т. Д., всегда будутпервый класс на ваших входах, то есть вы будете никогда делать

<input class='someNewClass input1'

, тогда вы могли бы

$("input[class ^= 'input']").each(function(){

^= означает, что начинается с, в то время как *= значит содержит где угодно.

Answer 2

дайте им общее имя, и вам нужно проанализировать значение, так как изначально оно будет текстовым

var result= 0;

$("input[name='sum']").each(function(){
    result = result + parseInt($(this).val(),10);
});