Ocultar elementos “Button” con Javascript
Os adjunto una funcionilla que muestra sólo un botón cuando se seleccionan elementos de un “ListBox“. Cuando solo hay un elemento seleccionado se muestra el botón “btnUNO” y cuando se seleccionan varios “btnVarios“. Esto está hecho con la intención de mostrar diferentes botones con diferentes funcionalidades para cada una de las posibilidades. Al estar hecho con javascript, no hace falta recargar, por lo que se puede hacer casi invisible al usuario.
function ItemsSeleccionados()
{
// lb es el listbox que vamos a controlar
var lb = document.getElementById("lbZonas");
var optLength = lb.options.length;
var nselec = 0;
if (lb != null)
{
for(var i=0;i<optLength;i++){
if(lb.options[i].selected)
nselec++;
}
// Si solo dejo btnUNO, sino btnVarios
var btnUNO = document.getElementById("btnSelZona");
var btnVarios = document.getElementById("btnSelZona2");
if (nselec > 1)
{
btnUNO.style.visibility = 'hidden'; // No se ve
btnUNO.style.display = 'none'; // No ocupa espacio
btnVarios.style.visibility = 'visible'; // Se ve
btnVarios.style.display = ''; // Se muestra por defecto
}
else
{
btnUNO.style.visibility = 'visible';
btnUNO.style.display = '';
btnVarios.style.visibility = 'hidden';
btnVarios.style.display = 'none';
}
}
}
Cómo habréis notado, no hace falta cambiar “visibility” (oculta el control, pero ocupa espacio) en el estilo si se toca el “display” (se elimina de los controles y no ocupa espacio), pero lo he dejado para ver las diferentes cosas que se pueden hacer.
Puede que te interese:
Nada relacionado
Información Bitacoras.com…
Valora en Bitacoras.com: Os adjunto una funcionilla que muestra sólo un botón cuando se seleccionan elementos de un “ListBox“. Cuando solo hay un elemento seleccionado se muestra el botón “btnUNO” y cuando se seleccionan varios “btnVarios“. Esto está…..
function oculto(id){
if (document.getElementById){
var el = document.getElementById(id);
el.style.display = (el.style.display == ‘none’) ? ‘block’ : ‘none’; }}
function marca(id){
if (document.getElementById){
var el = document.getElementById(id);
el.style.display = (el.style.display == ‘none’) ? ‘block’ : ‘none’; }}
window.onload = function(){
oculto(‘pdf’);}
function mostrar(enla,etik) {
obj = document.getElementById(etik);
obj.style.visibility = (obj.style.visibility == ‘hidden’) ? ‘visible’ : ‘hidden’;}
al poner en raoton sobre el boton se vera esto
el texto anterior se elimina y se ve esto si das click otra vez se ve lo anterior