在博客帖子中加载jQuery会导致它冻结

Question

在博客帖子中加载jQuery会导致它冻结

Tim*_*imm 1 javascript jquery blogger jcarousel

我创建了一些人们可以复制并粘贴到他们网站的代码,它应该在blogspot中工作.此代码需要jQuery和jCarousel插件.我用

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

Run Code Online (Sandbox Code Playgroud)

在运行我的javascript代码之前加载jQuery.问题是一些博客模板已经加载了jQuery,然后运行上面的代码导致博客文章永远不会加载(它只是停留在加载屏幕上).

我可以使用javascript加载它if (typeof jQuery == "undefined")但是为了jCarousel插件工作jQuery必须首先加载,所以这导致post加载但旋转木马打破.

有人知道任何解决方案吗？

Answer 1

Jef*_*f B 5

难道你不能检查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>

Run Code Online (Sandbox Code Playgroud)

第二个想法,我不相信这将永远有效.我不认为这可以保证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>

Run Code Online (Sandbox Code Playgroud)

演示:http://jsfiddle.net/jtbowden/Y84hA/2/

(将左栏中的框架更改为任何版本的jQuery或其他库.它应该始终正确加载轮播)

编辑:

这个版本很相似,但是<head>对lib 使用了一个加载,就像jQuery一样.它比$.getScript()以下更快:

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

归档时间：	13 年，6 月前
查看次数：	713 次
最近记录：	13 年，6 月前