Quiero proporcionar funciones de ayuda que permitan ocultar o mostrar una carga a varios componentes de una IU compleja basada en jQuery.div (se utiliza cuando se inicia una llamada Ajax desde varias partes de la página).

Con ese fin, inicialmente escribí un código como este:

<script type="text/javascript">
$(function ()
{
    var loadingControl = $("#loading");

    function showLoading() {
        loadingControl.show();
    }
}
</script>

Sin embargo, rápidamente me di cuenta de queshowLoading Sólo está en el alcance dentro de ese particulardocumento listo.

Siguiendo los consejos de

https://stackoverflow.com/a/1055799/141172

DeclaréshowLoading En alcance global como este:

<script type="text/javascript">
var showLoading;
$(function ()
{
    var loadingControl = $("#loading");

    function showLoading() {
        loadingControl.show();
    }
}
</script>

Sin embargo, todavía encuentro queshowLoading no está disponible endocumento listo Bloques que se ejecutan posteriormente. El error es

El valor de la propiedad 'showLoading' es nulo o no definido, no es un objeto Function

Este comportamiento se puede ver aquí:

http://jsfiddle.net/NfXFT/4/

El jsFiddle también prueba que elshowLoading implementacióndocumento listo corre antes de ladocumento listo Bloque que lo llama.

¿Qué está mal y cómo puedo hacer que este método auxiliar esté disponible?

Lo defino dentro de undocumento listo bloque porque se basa en que '#loading' esté disponible. ¿Existe un mejor enfoque para lograr el mismo objetivo de proporcionar una función de ayuda para ocultar / mostrar la pantalla de carga? Quiero mantener esto en una función auxiliar porque la implementación puede cambiar más adelante.