¿Por qué hacer una diferencia en donde incluyo el archivo de script jQuery?

Question

En mi página principal (para todas las páginas en mi sitio) Tengo un ToolkitScriptManager.

En la página de contenido, hay una serie de hipervínculos y divs para la funcionalidad plegable.

El código para mostrar / ocultar los paneles de trabajo como la siguiente:

$(document).ready(function() {
// Hookup event handlers and execute HTML DOM-related code
$('#nameHyperLink').click(function() {

        var div = $('#nameDiv');
        var link = $('#nameHyperLink');
        if (div.css('display') == 'none') {
            link.text('Hide Data');
            div.show('100');
        }
        else {
            link.text('Show Data');
            div.hide('100');
        }

    });
});

Si incluyo un ScriptReference al archivo de jQuery 1.4.2 en el toolkitscriptmanager, el código JavaScript se ejecuta de forma incorrecta en la página (sólo se cambia el texto para el hipervínculo, el div en realidad no se muestra). Sin embargo, si no incluya el archivo de jQuery en el ToolkitScriptManager y en lugar de incluirlo en la página de contenido, funciona correctamente.

Soy un novato Javascript / jQuery, y esto no tiene sentido en absoluto. ¿Qué está pasando aquí?

Answer 1

Posicionamiento del guión incluyen Es importante que el árbitro jQuery. Si nos fijamos en su fuente generado apostaría la etiqueta está por debajo de la función de script (). Usted debe asegurarse de que la referencia jQuery viene tan pronto como lo puede conseguir en la fuente de la página.

Trate de mover la referencia de la biblioteca jQuery en la cabecera de la página maestra, que debería funcionar. De lo contrario publicar hasta alguna fuente!

Answer 2

Al igual que Tj dice ... probablemente debería estar en la sección de cabecera de la página principal. También, es bueno para enlazar a la versión de Google de esta biblioteca, porque es probable que sus usuarios ya habrá que caché. Por ejemplo, vistazo a la fuente de esta misma página.

Las dos causas más probables aquí son $ no está definido todavía (véase la respuesta de Tj) y $ consiguiendo definido por otra biblioteca, tales como prototipo.

I altamente sugeriría que mirar en el uso depurador de JavaScript de Firebug, o por lo menos echar un vistazo a incorporado en la consola de error de Firefox (Herramientas -> Consola de errores). Eso le dará una mejor idea de lo que está pasando que no sea "no está funcionando".