Comment ajouter coché et subracté non coché en utilisant jquery

Question

Comment pouvez-vous ajouter 25 lorsque vous cochez cette case et soustrayez 25 lorsque vous décochez la case sur le numéro qui se trouve dans l'intervalle id = "preciototal"?

Jetez un coup d'oeil ici s'il vous plaît. Sa partie d'un formulaire de commande et l'idée est-il calcule le prix total:

http://jsfiddle.net/9YGBu/2/

Answer 1

Comme une réponse alternative démontre un peu plus de concepts avancés jQuery pour vous, considérez le javascript suivant:

$(document).ready(function() { 
    // cache anything reused in variables 
    var $zonaenvio = $("#zonaenvio"); 
    var $gelypilas = $('#gelypilas'); 
    var $totalprecio = $('#totalprecio'); 
    var $totalSpan = $('#preciototal'); 
    // declare a function that does everything 
    var updatePrice = function() { 
     // get the value of the selected product, or 0 if nothing selected 
     var productAmount = parseInt($zonaenvio.val() || '0'); 
     if (productAmount > 0) { 
      // if something selected, calculate correct total and show it 
      var correctTotal = productAmount + ($gelypilas.is(':checked') ? 25 : 0); 
      $totalSpan.text(correctTotal); 
      $totalprecio.show('slow'); 
     } else { 
      // otherwise, if nothing selected, hide the total information 
      $totalprecio.hide(); 
     } 
    }; 
    // bind the function to the input events 
    $zonaenvio.change(updatePrice).change(); // trigger once if needed 
    $gelypilas.change(updatePrice); 

}); 

Est-ce que cela a du sens? Voir here pour un exemple de travail jsFiddle.

Answer 2

Je pense que vous devriez chercher quelque chose comme ça!

http://jsfiddle.net/9YGBu/21/

esprit que j'ai ajouté un identifiant à la case à cocher, vous pouvez wanna changer le sélecteur de travailler avec la propriété nom au lieu

Answer 3

Peut-être quelque chose comme ça, je en cache le sélecteur d'optimisation :

$(document).ready(function() { 
    var precioTotal = $("#preciototal"), gelypilas = $('#gelypilas'), 
     totalPrecio = $('#totalprecio'), zonaEnvio = $("#zonaenvio"); 
zonaEnvio.change(function() { 
    precioTotal.text($(this).val()); 
    gelypilas.removeAttr('checked'); 
    totalPrecio.show("slow"); 
}).change(); // trigger once if needed 
    gelypilas.change(function(){ 
     if(gelypilas.attr('checked')){ 
      precioTotal.text(parseInt(precioTotal.text()) + 25); 
     }else{ 
      precioTotal.text(Math.max(0, parseInt(precioTotal.text()) - 25)); 
     } 
    }); 
});