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.

Please follow and like us:

3 pensamientos en “Ocultar elementos “Button” con Javascript

  1. Pingback: Bitacoras.com

  2. 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

  3. Para ocultar uno o mas botones se puede hacer esto:

    Supongamos que deseo ocultar algunos botones del formulario antes de imiprimir, entonces, en el input type del botón imprimir, le agrego, los nombres de los botones que no deseo que me aparezcan así;

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *