1

Tengo este codigo y cada que yo eligo un valor del select realiza unas operaciones, lo que necesito es que cuando vuelva a seleccionar una cantidad menor a la que ya seleccione haga de nuevo las operaciones.

$('#boton2').click(function(){
       let z = "<div style='display: flex; justify-content: flex-end; margin-top: 16%; margin-right: 5%'><select class='opciones3' name='opciones3' style='width: 25%; font-size: initial; font-weight: bold'><option value='1'>1</option><option value='2'>2</option><option value='3'>3</option><option value='4'>4</option><option value='5'>5</option></select></div>";
       $('#matiza').after(z);

   $('.opciones3').change(function () {
        let r = parseInt($('p.price').text());
        let suma3 = parseInt($('p.price').text());
        $('.opciones3 :selected').each(function() {
            suma3 *= Number($(this).val());
        });
        let x = parseInt($('p#subtotal').text());
        let ttl = x + suma3 - r;
        let sttl = ttl * 0.1;
        let fnl = ttl - sttl;
        document.getElementById("subtotal").innerHTML = ttl.toFixed(2);
        document.getElementById("ahorro").innerHTML = sttl.toFixed(2);
        document.getElementById("totalcompra").innerHTML = fnl.toFixed(2);
        });
   });

html

    <div id='principal'><input class='Survey' type='hidden' name='Survey[]'  id='ID' value=''/>" +
                "<div class='quoter-list' style='height: auto; display: flex'><div style='margin-top: 4%;'>
    <a rel='shadowbox;' href='https://www.youtube.com/embed/9q8eqQDyAlI?autoplay=1'>
    <img src='/static/v2/images/img1-1.png' style='width: 100px; height: 100px;'>
    </a><
    /div>
    <div class='quoter-l' style='margin-top: 1%;'><img src='/static/v2/images/img5-2.png' style='width: 70px; height: 70px; '><img src='/static/v2/images/img5-2.png' style='width: 70px; height: 70px;'></div>
    <div class='tt-dc' style='margin-left: 16px'><p class='title' style='font-family: Bariol; width: 98%;text-align: justify;color: #3c144e; margin-top: 5px; font-size: 20px;font-weight: bold;padding-left: 10px; letter-spacing: -0.9px;'></p>
<div style='margin-top: auto'><p class='descp' style='font-family: Bariol;width: 98%;text-align: justify;color: #505050; margin-top: 5px; font-size: 16px;padding-left: 10px; letter-spacing: -0.7px; line-height: 1.25;font-style: normal;font-weight: normal'></p></div>  </div> <div style='display: block'>
<div style='display: flex; justify-content: flex-end; margin-top: 16%; margin-right: 5%' id='matiza'>
</div>
<div style='display: flex; margin-top: 26%'>
<button type='button' class='add quit' onclick='remove()'>Quitar</button>
<p style='display: inline-flex; margin-bottom: 5px;align-self: flex-end;font-size: 24px;font-family:Bariol; color: #8dc641;font-weight: bold;'>$</p>
<p class='price' style='text-align: right; margin-right: 5px; margin-bottom: 5px; align-self: flex-end; font-size: 24px; color: #8dc641; font-family: Bariol; font-weight: bold; letter-spacing: -1px;line-height: normal;font-stretch: normal; font-style: normal'>
</p>
</div>
</div>
</div>
</div>
</div>

¿Como lo puedo hacer?

4
  • Puedes poner tu codigo html para poderte ayudar? el 24 jul. 2017 a las 15:57
  • Selecionar una cantidad? osea vuelves a manipular el select o cambias el valor de tu input? el 24 jul. 2017 a las 15:58
  • Vuelvo a manipular el select el 24 jul. 2017 a las 16:07
  • ya ok entiendo pero tu html para saber donde estas poniendo tu select el 24 jul. 2017 a las 16:09

1 respuesta 1

0

Podrias usar localStorage para guardar el valor e identificar si es menor al anterior. Como no sé qué valor quieres coger, he cogido primero el valor del select, y luego los de las variables llamadas r y suma3.

Tu código quedaría así:

$('#boton2').click(function(){
       let z = "<div style='display: flex; justify-content: flex-end; margin-top: 16%; margin-right: 5%'><select class='opciones3' name='opciones3' style='width: 25%; font-size: initial; font-weight: bold'><option value='1'>1</option><option value='2'>2</option><option value='3'>3</option><option value='4'>4</option><option value='5'>5</option></select></div>";
       $('#matiza').after(z);

   $('.opciones3').change(function () {
        if(localStorage.getItem("valorSelect")==null || localStorage.getItem("valorSelect")>=r){
          localStorage.setItem("valorSelect",this.val());
        }
        if(localStorage.getItem("valorSelect")<=this.val()){
          let r = parseInt($('p.price').text());
          if(localStorage.getItem("select1")==null || localStorage.getItem("select1")>=r){
             localStorage.setItem("select1", r);//solo cuando sea menor o null entrará
          }
          let suma3 = parseInt($('p.price').text());
          if(localStorage.getItem("select2")==null || localStorage.getItem("select2")>=suma3){
             localStorage.setItem("select2", suma3);//solo cuando sea menor o null entrará
          }
          if(localStorage.getItem("select1")<=r && localStorage.getItem("select2")<=suma3){
            $('.opciones3 :selected').each(function() {
                suma3 *= Number($(this).val());
            });
            let x = parseInt($('p#subtotal').text());
            let ttl = x + suma3 - r;
            let sttl = ttl * 0.1;
            let fnl = ttl - sttl;
            document.getElementById("subtotal").innerHTML = ttl.toFixed(2);
            document.getElementById("ahorro").innerHTML = sttl.toFixed(2);
            document.getElementById("totalcompra").innerHTML = fnl.toFixed(2);
          }//cierro if
        }//cierro primer if
        });
   });

Documentación

1
  • Gracias me funciono perfectamente el 24 jul. 2017 a las 16:35

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.