Chrome: Unbeught ReferenceError: $ no está definido

Estoy usando jQuery en una página web. Al usar $ en Internet Explorer, funciona bien. Cuando se hace referencia $ en Chrome o Firefox falla con el error:

Uncaught ReferenceError: $ is not defined.

Captura de pantalla:

enter image description here

Con mi código fuente:

<!DOCTYPE html> 
<html> 
<head> 
    <script type="text/javascript" src="jquery-1.7.2.min.js"></script> 
    <script type="text/javascript"> 
     function divClick(sender, event) 
     { 
//  var chk = $(sender).find("input").first()[0]; 
     var chk = jQuery(sender).find("input").first()[0]; 
     alert("Works in ie"); 
     } 
    </script> 
</head> 
<body> 

<div onclick="divClick(this, event)"> 
    <input type="checkbox"> 
</div> 

</body> 
</html>

Nota: Los navegadores están siendo dirigido a un archivo en el sistema de archivos local:

enter image description here

actualización: intentado cambiar a jQuery.

actualización: El cromo se encuentra el archivo de jQuery (es decir, no 404):

enter image description here

Fuente

2012-05-18 Ian Boyd

Compruebe si 'jquery-1.7.2.min.js' está en la misma carpeta que el html. '$ is not defined' es un error que se obtiene cuando jQuery lib no está incluido. –

¿Podría dar un ejemplo de cómo ajustar mi función en un dom listo? ¿Y también cómo mover el oyente click al js? Mira mi ejemplo a continuación. – Patriotec

Y esta pregunta es aquí sólo para documentar el error en Chrome y Firefox:

Html File encoding   IE9  Chrome 
========================= ======= ====== 
Windows-1252     Works Works 
UTF-8 (without BOM)   Works Works 
UTF-8 (with BOM EFBB)  Works Works 
UTF-16 (with LE BOM FFFE) Works Fails 
UTF-16 (with BE BOM FEFF) Works Fails

Presumiblemente Chrome (y Firefox) asumir que un archivo separado script tiene la misma codificación que el archivo html.

Chrome intenta leer jquery-1.7.2.js como UTF-16 y se sorprende al descubrir que el archivo es puro (Windows-1252) basura.

Fuente

2012-05-18 20:08:33

Comprobar si la ruta de jquery-1.7.2.min.js es correcta. Puedes comprobar firebug si utilizas la herramienta de desarrollo de firefox o chrome para ver si el archivo se está descargando. Lo más probable es que obtenga 404 para el archivo jQuery debido a que $ no está definido en la página, que es un alias del objeto jQuery.

Fuente

2012-05-18 19:50:25 ShankarSangoli

Probar:

var chk = jQuery(sender).find("input").first()[0];

Fuente

2012-05-18 19:51:32

Se actualizó la pregunta para incluir eso. –

Su función debe ser envuelto en una lista dom:

$(function(){ 

    function divClick(sender, event) 
    { 
    var chk = $(sender).find("input").first()[0]; 
    alert("Works in ie"); 
    } 

});

que permitirá a la función para disparar sólo después de la página se ha cargado. también sus scripts deben cargarse justo antes de la etiqueta HTML de cierre. no toda la parte superior. eso permitirá que la página cargue el HTML y CSS más rápido porque no tiene que esperar a que cargue JS.

También asegúrese de tener la ruta de acceso correcta a jQuery desde su HTML.

última cosa,

En cambio si tener a su oyente clic en HTML en línea tratar de moverlo a la JS. Es solo una manera más limpia y organizada de manejarlo.

$('.clickMe').click(function(){ 
    //do stuff here 
})

Fuente

2012-05-18 20:05:59 laymanje

¿Podría dar un ejemplo de cómo * ajustar mi función en un dom ready *? ¿Y también cómo mover el oyente click al 'js'? –

Están ahí, el dom ready es $ (function() {}) Es la versión de jQuery short hand. para la referencia de evento click this jsfiddle. http://jsfiddle.net/QgeD9/ – laymanje

En lugar del onclick en el html, asigné todo a través de la identificación en el código de Jquery.

No estoy seguro si desea saber si la casilla de verificación está marcada o si la casilla de verificación está marcada. Puse la verificación de entrada en el código y el código comentado si se hace clic en el div.

<!DOCTYPE html> 
<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> 

<script type="text/javascript"> 
$(function(){ 
// $('#divid').unbind("click").click(function(){ 
$('#someid').unbind("click").click(function(){ 
if($(this).is(':checked')){ 
alert("checked"); 
}else{ 
alert("not checked"); 
} 
}); 
}); 
</script> 

</head> 
<body> 

<div id="divid"><input type="checkbox" id="someid"></div> 

</body> 
</html>

Fuente

2012-05-18 20:19:30 Patriotec

Usted puede obtener este error con el Javascript en Firefox y Chrome:

Uncaught ReferenceError: $ is not defined.

Si incluyó jQuery así:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"> 
</script>

Y el servidor está configurado para no permitir javascript contenido para descargar y ejecutar en tiempo de ejecución, entonces obtienes el error anterior. Echar un vistazo a todo el error:

[blocked] The page at https://yoursite.com/blah# ran insecure content 
from http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js. 
/blah#:1 
Uncaught ReferenceError: $ is not defined

Lo que significa es que su servidor web no permite javascript contenido que se carga sobre la marcha. Es un riesgo de seguridad porque alguien podría inyectar material maligno para que lo descargue y ser dueño de sus servidores.

Fuente

2013-11-28 03:40:35

Ninguna de las anteriores era aplicable para mí en Chrome 49. tuviera que especificar el tipo como "application/javascript" de esta manera:

<script src="lib/jquery-1.11.3.min.js" type="application/javascript"></script>

El uso de "text/javascript" no estaba funcionando.

Fuente

2016-05-10 15:05:48 nepdev

realmente funcionó como un encanto :) intenté muchas soluciones pero no pude encontrar una solución como esta –

Chrome: Unbeught ReferenceError: $ no está definido

Respuesta

Cuestiones relacionadas