0

Obtengo el valor de un input para hacer aparecer y desaparecer un div según la opción que se elija. aquí la idea es que al seleccionar cualquiera de las opciones a excepción de la primera el div #precio se desaparezca.

$('#pago').focusout(function() {
	var x = $(this).val();
	var metod_pay = ['Credit Card','Debit Card','Paypal','Wire Transfer'];
																 
    metod_pay.forEach(pay => {
	   if( x == pay ){																		 
         $("#precio").css("display", "none");
	   }
	else{
		$("#precio").css("display", "block");
	}
	})
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="input-group mb-3">
 <input class="custom-select col-12" id="pago" name="pay_mode" placeholder="--Select Pay Mode--" list="browsersss" autocomplete="off" required="required">
  <datalist id="browsersss">																													 
    <option value="Efectivo">Efectivo</option>																																		 
    <option value="Credit Card">Credit Card</option>																																		 
    <option value="Debit Card">Debit Card</option>																																		 
    <option value="Wire Transfer">Wire Transfer</option>																																		 
    <option value="Paypal">Paypal</option>																																	</datalist>
</div>
 <div id="precio"> <input type="text"> </div>

pero solo está seleccionando el último objeto 'Wire Transfer' si selecciono 'paypal', el div debería seguir oculto pero no es el caso.

2
  • Qué tal si en el condicional que tienes dentro del foreach pones: if(x[pay] == pay)...
    – Candelo
    Commented el 1 feb. 2020 a las 18:16
  • El problema que el foreach sigue ejecutandose, y siempre acabará con un block, exceptuando en el caso del último elemento del array. Es decir, si selecciono Credit card, la primera vez hara un none pero luego volerá a ponerse block
    – David_helo
    Commented el 1 feb. 2020 a las 18:18

1 respuesta 1

0

Puedes cambiar el foreach por un if.

if(metod_pay.includes(x)){
   $("#precio").css("display", "none");
}else{
   $("#precio").css("display", "block");
}
1

Tu Respuesta

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

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