Ejemplo:
Nuestro numero de cuenta es: 000000000000000000000
Codigo HTML:
<div>
<div>
<SELECT NAME="pago" onChange="pagoOnChange(this)">
<OPTION VALUE="transferencia">Transferéncia</OPTION>
<OPTION VALUE="tarjeta">Pago con tarjeta</OPTION>
</SELECT>
</div>
<div id="nCuenta" style="display:none;">
Nuestro numero de cuenta es: 000000000000000000000
</div>
<div id="nTargeta" style="display:;">
<br>
Numero*
<br>
<input type='text' name='nTarjeta'size='20' maxLength='60'>
<br><br>
Titular*
<br>
<input type='text' name='titularTarjeta'size='20' maxLength='60'>
<br><br>
Numero de seguridad*
<input type='text' name='numeroSeguridad'size='3' maxLength='3'>
</div>
</div>
Codigo Javascript:
function pagoOnChange(sel) {
if (sel.value=="transferencia"){
$("#nCuenta").show();
$("#nTargeta").hide();
}else{
$("#nCuenta").hide();
$("#nTargeta").show();
}
}
Bueno ahí lo dejo, seguro que hay alguna forma mejor o más optima pero yo lo resolví así, si alguien quiere poner un comentario explicando una forma mejor que no se vea cohibido puesto que la función de este blog es ayudar y mejorar en la medida de lo posible.
Un saludo.
Hola Sergio, este código me ha ayudado mucho.
ResponderEliminarHe estado haciendo algo parecido, para hacer aparecer/desaparecer varios div.
La cuestión es que tengo varios div con la id=nCuenta
y otros tantos con la id=nTargeta
(lo pongo de esta manera para adaptarlo al ejemplo)
pero cuando elijo alguno de los dos casos, sólo me desaparece el primer div del objeto que tiene que ocultarse.
Quiero que se oculten todos los objetos que contentan el mismo id. ¿Cómo puedo conseguirlo?
Gracias por tu ayuda.
No se si te he entendido bién, pero para empezar, te recomendaria que no repitieras id, si necesitas referirte a varios elementos iguales o parecidos hazlo asignandole un atributo class (y no tiene porque estar ligado con ninguna clase css).
EliminarLuego, si lo he entendido bién y lo que quieres es ocultar varios div de golpe y mostrar tambien varios de golpe, una de dos:
- Metes todos los id=ncuenta (deberian pasar a class='cuenta') en un div contenedor:
<div id='contenedorCuentas' >
<div class='cuentas' id='nCuenta_1'></div>
<div class='cuentas' id='nCuenta_2'></div>
</div>
<div id='contenedorTargeta' >
<div class='targetas' id='nTargeta_1'></div>
<div class='targetas' id='nTargeta_2'></div>
</div>
Y al cambiar el select Muestras y ocultas directamente el contenedor(ocultando así también el contenidoi).
- O bién la otra opción es ocultarlos con un each()
<div class='targetas' id='nTargeta_1'></div>
<div class='cuentas' id='nCuenta_1'></div>
<div class='targetas' id='nTargeta_2'></div>
<div class='cuentas' id='nCuenta_2'></div>
(Script)
if (sel.value=="transferencia"){
$(".cuentas").each(function(index, elem){
$(elem).show();
});
$(".targetas").each(function(index, elem){
$(elem).hide();
});
}else{
$(".cuentas").each(function(index, elem){
$(elem).hide();
});
$(".targetas").each(function(index, elem){
$(elem).show();
});
}
Y si no te he entendido bién pega un un trocito de tu codigo a ver si nos entendemos mejor
Eres un fenómeno.
ResponderEliminarLo he hecho por la segunda forma y me ha funcionado a la perfección.
Es para una selección de artículos en una galería. Cada tipo de artículo asociado con un class.
Estoy iniciándome en Java, pero sé cosas muy básicas aún.
Con lo del id y el class, error grave, se me ha ido la olla....
Gracias por tu ayuda. Un saludo.
Me alegro de que sirviese. ^^
EliminarUn saludo.
Tengo un problema , cunado trabajo dcon 3 select no me muestra la tercera opcion se repite siempre la segunta, es decir quiero trabajar enmi select con 3 options, gracias!
ResponderEliminarSe pude hacer lo mismo ocupando el selectOneMenu en jsf
ResponderEliminarsergio hermano muy agradecido por tu ayuda; pero tengo un problema
ResponderEliminarsergio hermano muy agradecido por tu ayuda; pero tengo un problema
ResponderEliminarMuy buen codigo, simple y facil de entender!!
ResponderEliminarMuchas gracias por la ayuda (Y)
2021 JUNIO SI SIRVE...
ResponderEliminarGracias brow si me funciono