Belajar Jquery keyup() method untuk perhitungan dengan jquery

Image

jquery

<script src="jquery-1.8.3.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
 function hitung() {
  var harga = $("#harga").val();
  var jumlah = $("#jumlah").val();
  if(harga>0 && jumlah>0){
   var total = parseInt(harga)*parseInt(jumlah);
   $("#total").val(total);
   diskon();
   bonus();
  }else{
   $("#total").val('');
   $("#diskon").val('');
   $("#bonus").val('');
  }
 }
 
 function diskon(){
  var total = $("#total").val();
  if(total>=500000){
   var diskon = parseInt(total)*20/100;
   $("#diskon").val(diskon);
  }else if(total>=200000){
   var diskon = parseInt(total)*15/100;
   $("#diskon").val(diskon);
  }else if(total>=100000){
   var diskon = parseInt(total)*10/100;
   $("#diskon").val(diskon);
  }else if(total>=50000){
   var diskon = parseInt(total)*5/100;
   $("#diskon").val(diskon);  
  }else{
   $("#diskon").val(0);
  }
 }
 function bonus(){
  var total = $("#total").val();
  if(total>=500000){
   var bonus = 'Tas Pinggang';
   $("#bonus").val(bonus);
  }else if(total>=200000){
   var bonus = 'Payung';
   $("#bonus").val(bonus);
  }else if(total>=100000){
   var bonus = 'Kaos';
   $("#bonus").val(bonus);
  }else if(total>=50000){
   var bonus = 'Cangkir';
   $("#bonus").val(bonus);  
  }else{
   $("#bonus").val('Tidak Ada');
  }
 }
 $("#harga").keyup(function(){
  hitung();
 });
 $("#jumlah").keyup(function(){
  hitung();
 });
});
</script>

<table>
<tbody><tr>
 <td width="120">Harga Satuan</td>
    <td width="5">:</td>
    <td></td>
</tr>    
<tr>
 <td width="120">Jumlah Barang</td>
    <td width="5">:</td>
    <td></td>
</tr>    
<tr>
 <td width="120">Total</td>
    <td width="5">:</td>
    <td></td>
</tr>    
<tr>
 <td width="120">Diskon</td>
    <td width="5">:</td>
    <td></td>
</tr>    
<tr>
 <td width="120">Bonus</td>
    <td width="5">:</td>
    <td></td>
</tr>    
</tbody></table>