Cómo cambiar la visualización de un div usando javascript

tengo un div de la siguiente manera:Cómo cambiar la visualización de un div usando javascript

<div id="div1" style="display:none">

para hacerla visible de nuevo, intentó sin éxito:

document.getElementById('div1').style.display = ''

¿Cómo puedo cambiar la pantalla estilo de div para que sea visible de nuevo?

EDIT: aparentemente algo más está mal. esto es lo que realmente estoy haciendo:

<script type="text/javascript"> 
    flagprofile = <?php print 1 ?>; 
    if(flagprofile == 1){ document.getElementById('theid').style.display = 'block'; } else { document.getElementById('theid2').style.display = 'block'; } 
</script> 
<div id="theid" style="display:none">This is div 1</div> 
<div id="theid2" style="display:none">This is div 2</div>

Espero que aparezca la primera, pero no es así. ¿Qué pasa?

Fuente

2011-06-05 Carlos Muñiz

Cambiar el estilo a displayblock en lugar de '':

document.getElementById('div1').style.display = 'block';

Tenga en cuenta que hay que tener cuidado para restaurar el valor original de display. Si configura un elemento a para tener display: block, se verá muy diferente de lo que esperaba. Debería configurarlo en el display: inline, haciendo el cambio obvio al código anterior.

Editar, con su edición, el problema se hace evidente: no existen los elementos cuando se ejecute el Javascript. Espere hasta que todo se haya cargado antes de buscar elementos:

<script type="text/javascript"> 
window.onload = function() { 
    var flagprofile = <?php print 1 ?>; 
    if(flagprofile == 1){ 
     document.getElementById('theid').style.display = 'block'; 
    } else { 
     document.getElementById('theid2').style.display = 'block'; 
    } 
}; 
</script>

Fuente

2011-06-05 22:20:19 lonesomeday

parecer algo está mal. ¿Puedes echar un vistazo a mi edición anterior? –

@Charlie Ver edición. – lonesomeday

DUH !! tenías razón, tu respuesta funciona. ¡Gracias! –

que podría hacer:

document.getElementById('div1').style.display = 'block'

Fuente

2011-06-05 22:20:18 rforte

configura display a una cadena vacía, que es CSS válido, en lugar de tratar, among others:

document.getElementById('div1').style.display = 'block';

document.getElementById('div1').style.display = 'inline-block';

Fuente

2011-06-05 22:20:44

Funciona para mí ... ¿estás seguro de que no hay algo en tu hoja de estilo?

http://jsfiddle.net/minitech/YL8tq/

(Comentario la Javascript para probar sin)

Fuente

2011-06-05 22:27:21 Ryan

Se puede verificar que flagprofile se establece en 1? Intente hacer alert(flagprofile); y vea si realmente está configurado. Si no, puede intentar var flagprofile = 1; en su lugar.

Fuente

2011-06-05 22:49:36

var uname=document.getElementById("urname").value; 
    var passwrd=document.getElementById("passwd").value; 

    if(uname=="john" && passwrd=="123"){ 

     document.getElementById("form2").style.display='none'; 

     document.getElementById("form1").style.display='block'; 

    } 
    else{ 
     alert("Wrong username and pass"); 
    } 

}

Fuente

2013-02-06 10:07:04 user2046377

R u tratando yo crea un inicio de sesión utilizando JS ?! ¡No seguro en absoluto! – ThePunisher

Por alguna razón tuve que hacer las dos cosas a continuación para que funcionara.

document.getElementById('theid').style.display = 'block'; 

document.getElementById('theid').style.visibility = 'visible';

Después de simplemente configurar el primero todavía estaba oculto para mí. Una vez que inspeccioné el DOM en F12, noté que a pesar de display: block, visibility todavía estaba configurado en hidden.

También debo señalar que utilizo jQuery/jQueryUI para los mismos elementos.

Espero que esto ayude a alguien.

Fuente

2015-01-05 22:11:28

Esta es una muestra de trabajo: espero que ayude! Michael, Sudáfrica

function CountryChange() { 
 
    \t 
 
    \t if (document.getElementById("statebox").style.display == "block") 
 
    \t { 
 
    \t \t document.getElementById('statebox').style.display = 'none'; 
 
    \t \t document.getElementById('statebox').style.visibility = 'none'; 
 
    \t } 
 
    \t else 
 
    \t { 
 
    \t \t document.getElementById('statebox').style.display = 'block'; 
 
    \t \t document.getElementById('statebox').style.visibility = 'visible'; 
 
    \t } 
 
     
 
    }

<!-- BOX to switch on/off --> 
 
    <div class="control-group" id="statebox" name="statebox" style="display: none"> 
 
     <label class="control-label">Bla Bla Bla...</label> 
 
    </div> 
 

 

 
    <!-- Pic to click --> 
 

 
    <img onclick="javascript:CountryChange()" src="https://www.gstatic.com/images/branding/googlelogo/2x/googlelogo_color_284x96dp.png" name="picpincountry"/>

Fuente

2016-03-29 09:17:58

Cómo cambiar la visualización de un div usando javascript

Respuesta

Cuestiones relacionadas