Загрузка jQuery в сообщение блогера заставляет его замораживать

Я создал код, который люди могут копировать и вставлять на свои сайты, и он должен работать в blogspot. Этот код требует jQuery и плагин jCarousel. Я используюЗагрузка jQuery в сообщение блогера заставляет его замораживать

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

загрузить jQuery перед запуском моего javascript-кода. Проблема в том, что некоторые шаблоны Blogger уже загружают jQuery, а затем запуск вышеуказанного кода приводит к тому, что сообщение в блоге никогда не загружается (оно просто остается на экране загрузки).

Я мог загрузить его с помощью javascript после if (typeof jQuery == "undefined"), но для плагина jCarousel для работы jQuery должен быть загружен первым, поэтому это приводит к загрузке сообщения, но карусель для разрыва.

Кто-нибудь знает какие-либо решения?

источник

2012-04-25 Timm

почему бы не загрузить JQuery и сценарии jCarousel после подтверждения Jquery загружается – ManseUK

Не можете ли вы проверить наличие jQuery и загрузить jCarousel после этого?

<script type="text/javascript"> 
    if (typeof jQuery === "undefined") { 
     document.write('<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"><\/script>'); 
    } 
</script> 

<script src="http://path/to/jcarousel" type="text/javascript"></script>

На второй мысли, я не убежден, что это будет работать всегда. Я не думаю, что это гарантирует, что jQuery будет загружаться до jCarousel. Я придумал альтернативное решение, которое кажется более надежным. Он обеспечивает загрузку jQuery, а затем использует jQuery для загрузки библиотеки с использованием $.getScript(). Затем ваш код вызывается из обратного вызова getScript. Это гарантирует, что все происходит в правильном порядке:

<script type="text/javascript"> 
    if (typeof jQuery !== "undefined") { 
     loadLibs(); 
    } else { 
     var script = document.createElement('script'); 
     script.src = 'http://code.jquery.com/jquery.js'; 
     document.getElementsByTagName('head')[0].appendChild(script); 
     var timeout = 100; // 100x100ms = 10 seconds 
     var interval = setInterval(function() { 
      timeout--; 
      if (window.jQuery) { 
       clearInterval(interval); 
       loadLibs(); 
      } else if (timeout <= 0) { 
       // jQuery failed to load 
       clearInterval(interval); 
      } 
     }, 100); 
    } 

    function loadLibs() { 
     $.getScript("http://sorgalla.com/projects/jcarousel/lib/jquery.jcarousel.min.js", function(data, textStatus, jqxhr) { 
      myCode(); 
     }); 
    } 

    function myCode() { 
     $(document).ready(function() { 
      $('#mycarousel').jcarousel(); 
     }); 
    } 
</script>

Demo:. http://jsfiddle.net/jtbowden/Y84hA/2/

(изменить рамки в левой колонке на любой версии JQuery, или какой-либо другой библиотеке он всегда должен загрузить карусель правильно)

Edit:

Эта версия аналогична, но использует <head> нагрузку для Lib, так же, как для JQuery. Это быстрее, чем $.getScript():

http://jsfiddle.net/jtbowden/y8nGJ/1/

источник

2012-04-25 16:26:45

Так просто, спасибо! Теперь я чувствую себя глупо! – Timm

Спасибо за редактирование, но это, по-видимому, значительно увеличивает время загрузки (я уже пробовал что-то очень похожее, но мне не хотелось добавлять несколько секунд на время загрузки страницы) – Timm

Я добавил версию в свой ответ, как я использую для загрузки jQuery. Кажется, это немного быстрее, чем 'getScript()'. –

Загрузка jQuery в сообщение блогера заставляет его замораживать

ответ

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