Bu örneğimizde inputlara girilen tüm rakamları eşzamanlı olarak toplayacağız.
Öncelikle jquery "keyup" metodu ile inputa değer girildiğinde fonksiyonumuzu çalıştıracağız. Ardından fonksiyonda toplama işlemimii yapıp html ile "toplam" classlı span elementini içine yazdıracağız.
<script src="js/jquery-1.8.2.js" type="text/javascript"></script>
<script>
$.fn.sumValues = function() {
var sum = 0;
this.each(function() {
if ( $(this).is(':input') ) {
var val = $(this).val();
} else {
var val = $(this).text();
}
sum += parseFloat( ('0' + val).replace(/[^0-9-.]/g, ''), 10 );
});
return sum;
};$(document).ready(function() {
$('input.deger').bind('keyup', function() {
$('span.toplam').html( $('input.deger').sumValues() );
});
});
</script>
Değer 1: <input type="text" name="deger1" class="deger" /><br/>
Değer 2: <input type="text" name="deger2" class="deger" /><br/>
Değer 3: <input type="text" name="deger3" class="deger" /><br/>
Değer 4: <input type="text" name="deger4" class="deger" /><br/>
Değer 5: <input type="text" name="deger5" class="deger" /><br/>
Toplam Değer: <span class="toplam"></span>