jquery somme de plusieurs champs d'entrée si même classe dans une entrée

Bonjour j'ai besoin de faire la somme des valeurs de la même classe d'entrée dans une entrée avec un nom de classe total.

<input type="text" class="qty1" value="" />
<input type="text" class="qty1" value="" />
<input type="text" class="qty1" value="" />
<input type="text" class="qty1" value="" />
<input type="text" class="qty1" value="" />
<input type="text" class="qty1" value="" />

<input type="text" class="total" value="" />

Possible?

Un travail de violon ici

$(document).on("change", "qty1", function() {
    var sum = 0;
    $("input[class *= 'qty1']").each(function(){
        sum += +$(this).val();
    });
    $(".total").val(sum);
});

source d'informationauteur Andrei

  1. 24

    Vous avez assez bien, juste besoin d'ajuster votre JQuery un peu pour la sélecteurs

    mis à jour le violon : http://jsfiddle.net/5gsBV/7/

    $(document).on("change", ".qty1", function() {
    var sum = 0;
    $(".qty1").each(function(){
        sum += +$(this).val();
    });
    $(".total").val(sum);
});
  2. 2

    Je pense que votre question est ici:

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

    le modifier:

    $(".total").val(sum);

    Et au lieu de change cas je vous conseille d'utiliser keyup à la place.

    $(document).on("keyup"
  3. 1

    Nous pouvons utiliser à la suite de la fonction

     (function( $ ){
   $.fn.sum=function () {
    var sum=0;
        $(this).each(function(index, element){
            sum += parseFloat($(element).val());
        });
    return sum;
    }; 
})( jQuery );
//Call $('.abcd').sum();

    http://www.gleegrid.com/code-snippet/javascript/jquery-sum-input-values-by-class/?filter=bygroup&group=JQuery

  4. 0

    Je suggère cette solution:

    html

    <input type="text" class="qty1" value="" />
    <input type="text" class="qty1" value="" />
    <input type="text" class="qty1" value="" />
    <input type="text" class="qty1" value="" />
    <input type="text" class="qty1" value="" />
    <input type="text" class="qty1" value="" />

    <input type="text" class="total" value="" />

<div id="result"></div>

    js

    $(".qty1").on("blur", function(){
    var sum=0;
    $(".qty1").each(function(){
        if($(this).val() != "")
          sum += parseInt($(this).val());   
    });

    $("#result").html(sum);
});

    violon

  5. 0

    C'est presque ça:

    $(document).on("change", ".qty1", function() {
    var sum = 0;
    $(".qty1").each(function(){
        sum += +$(this).val();
    });
    $(".total").val(sum);
});

    http://jsfiddle.net/DUKL6/Un

  6. 0

    Le problème avec toutes les réponses ci-dessus, c'est qu'ils ne parviennent pas si vous saisissez quelque chose d'autre qu'un numéro. Si vous voulez quelque chose qui est plus convivial pour les utilisateurs, vous devriez faire un peu de validation, peut-être même de donner de la rétroaction lorsqu'une valeur autre qu'un numéro est entré. 

    $('body').on('change', '.qty1', function() {
    var total=0;
    $(".qty1").each(function(){
        quantity = parseInt($(this).val());
        if (!isNaN(quantity)) {
            total += quantity;
        }
    });
    $('.total').val('Total: '+total);
});