Tengo una funcionalidad para ocultar los controles de forma condicional antes de cargar el documento. Si pongo esta funcionalidad en $(document).ready, veo la página parpadeando para ocultar los controles condicionalmente. Me gustaría saber si hay un evento al que se puede llamar antes de que se active $(document).ready.
Como han mencionado otros hacen algo como esto
<div id="test" class="hidden"> my hidden div tag </div>
.hidden
{
display:none;
}
en el documento.listo, puede mostrar, esto es equivalente a onload, que espera hasta que se carga html
$(document).ready(function() {
$('#test').show();
});
ejemplo jsFiddle aquí
Problema común. Use CSS para tener los controles ocultos por defecto y luego use JS al $(document).ready para decidir qué controles hacer visibles. No habrá parpadeo. Simplemente se verá como si las partes apropiadas de la página se cargaran progresivamente.
No puede ejecutar JS con seguridad antes de que el documento esté listo y partes del documento estarán visibles antes de poder ejecutar JS. Por lo tanto, la única solución es asegurarse de que todos los elementos no parpadeantes estén ocultos por defecto y solo muestre los que quiere que sean visibles.
La forma más sencilla de hacer esto es simplemente poner una clase común de todos los elementos dinámicos:
<div id="myControl1" class="initiallyHidden"></div>
y utilizar CSS para asegurarse de que todos empiezan a cabo oculta:
.initiallyHidden {display: none;}
Y luego su javascript anulará eso cuando decida que un elemento debería estar visible:
document.getElementById("myControl1").style.display = "block";
Cuando tengo necesaria para ocultar algo antes Javascript se carga Fijaría escondido en css de esta manera:
display:none;
o:
visibility: hidden;
También puede utilizar las condiciones en combinación con Javascript para revelar si es necesario.
o desde que se mencionó jquery: 'class =" ui-helper-hidden-accessible "' –
llamada de la función JavaScript en lado de elemento HTML
ejemplo:
<span></span>
<script> call JS function</script>
Gracias, de esta manera, no podremos hacer cosas genéricamente. Si tengo que ocultar y mostrar varios elementos, entonces hacerlo con lo que has mostrado podría no ser la opción correcta –
acordada, pero puedes consultar todo el extremo de la página de referencia de JavaScript externo. y cal la función de JavaScript después de todo el elemento. esto ahorrará el tiempo de carga del archivo al que se hace referencia. Luego puede ejecutar la función antes de cargar todo el archivo. –
puede simplemente abrir una etiqueta de script justo después de que el HTML que desea ocultar condionnaly (jQuery deben ser declaradas antes sin embargo) y luego llamar a hide directamente, no dentro de un $ (documento). Listo como este:
<div id="toHide">Lorem ipsum</div>
<script type="text/javascript">
$("#toHide").hide();
</script>
Tienes que poner sus elementos antes de ejecutar javascript
<div>hi</div>
<script>
$("div").css('background-color', '#EEE');
</script>
No se puede establecer que los que oculta de manera predeterminada y sólo mostrar la los que necesita en '$ (document) .ready'? – Oded
Cuando dices oculto de manera predeterminada, ¿estás refiriendo a usar css para tenerlos ocultos? Si hago esto, ¿podrá jquery mostrarlos y ocultarlos? –
Sí, me refiero a CSS, y sí, jQuery sí. – Oded