1

Я использую Google код отложить загрузку JavaScript (google pages)

Но у меня есть некоторые встроенные JavaScripts, такие как:

<script type="text/javascript"> 
$(function() { 
    alert("please work"); 
}); 
</script> 

И это дает мне :

Uncaught ReferenceError: $ is not defined

Я думаю, что мне нужна функция, которая была вызвана после того, как был загружен JQuery и инициализировать свои встроенные JavaScripts. Но если есть другой путь, я буду рад.

EDIT:

Некоторые из вас совершенно не в тему. Махеш Сапкал был близок.

С помощью этого кода у меня нет ошибки, но до сих пор не работают

<head> 
    <script type="text/javascript"> 
     var MhInit = NULL; 

     // Add a script element as a child of the body 
     function downloadJSAtOnload() { 
      var element = document.createElement("script"); 
      MhInit = element.src = "my_packed_scripts.js"; 
      document.body.appendChild(element); 
     } 

     // Check for browser support of event handling capability 
     if (window.addEventListener) 
      window.addEventListener("load", downloadJSAtOnload, false); 
     else if (window.attachEvent) 
      window.attachEvent("onload", downloadJSAtOnload); 
     else window.onload = downloadJSAtOnload; 
    </script> 

</head> 
<body> 
    <script type="text/javascript"> 
     MhInit.onload = function() { 
      console.debug("here"); 
     }; 
    </script> 
</body> 
+0

использование jQuery.noConflict(); –

ответ

2

Если вы собираетесь реализовать асинхронную загрузку Javascripts, то это была бы лучшая идея не иметь встроенный Javascript, который зависит в асинхронно загруженном файле.

Я подозреваю, что вы загружаете jQuery асинхронно, то есть после загрузки содержимого DOM, поэтому любые встроенные сценарии в вашей DOM, зависящие от jQuery, не будут выполнены. В этом случае вы можете использовать что-то вроде RequireJS для управления зависимостями JS и загружать их асинхронно.

Однако, если вы хотите найти более простое решение, я бы предложил разместить ваши JS-библиотеки в конце DOM и привязать любые зависимости к обработчику onload.

Что-то вроде этого

<body> 
    <!-- Body content --> 
    <script>document.onload = function() { //use jQuery here }</script> 
</body> 
<script src="/path/to/jQuery/"></script> 
+0

пробовал это безрезультатно. если это работает для отложенного jQuery? – Trix

+0

Что вы подразумеваете под отсроченным jQuery? – Achrome

-3

попробовать этот http://w3schools.com/jquery/default.asp. вы можете легко это сделать.

<script> 
$(document).ready(function(){ 
$("p").click(function(){ 
alert("please work"); 
}); 
}); 
</script> 
+0

'$' не определено. Вы не можете вызывать '$' для задержки загрузки JS до тех пор, пока '' '' '' '' '' '' '' '' '' '' '' '. – Quentin

2

Поскольку вы откладывая загрузку JQuery, ваш встроенный Javascript должен быть вызван только тогда, когда JQuery по окончании загрузки. Используйте следующий код, чтобы проверить, была ли загружена библиотека.

var scriptElem = document.createElement("script"); 

scriptElem.onload = function() { 
    alert('please work'); 
}; 

scriptElem.src = "http://code.jquery.com/jquery-1.10.1.min.js"; 

document.getElementsByTagName("head")[0].appendChild(scriptElem); 
3

Нельзя использовать jQuery перед его загрузкой. Если вы переместите <script src="jquery.js" /> в нижней части своей страницы, вы также должны переместить все строки, которые используют ниже $(...).

Существует сложное решение, которое идет что-то вдоль этих линий:

1) Определение нескольких переменных в верхней части страницы:

var _jqq = []; 
var $ = function(fn) { 
    _jqq.push(fn); 
}; 

2) В середине страницы вы можете написать :

$(function() { 
    alert("document ready callback #1"); 
}); 
$(function() { 
    alert("document ready callback #2"); 
}); 

3) в нижней части страницы, включают JQuery:

<script src="//code.jquery.com/jquery.min.js"></script> 

4) И, наконец:

$(function() { 
    $.each(_jqq, function(i, fn) { 
     fn(); 
    }); 
}); 

Demo

+0

это выглядит довольно устрашающе и просто, я все еще его тестирую, скоро обножу –

Смежные вопросы