包含.js文件阻止加载jQuery

时间:2016-03-23 20:54:27

标签: javascript jquery

我是jquery / web design的新手并下载模板以尝试熟悉自己。我遇到了某个阻止我的jQuery加载的脚本的问题。我在我网站的标题中有这个:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.14.0/jquery.validate.min.js"></script>
<script type="text/javascript" src="layout/scripts/jquery-mobilemenu.min.js"></script>
<script type="text/javascript" src="layout/scripts/responsiveslides.js-v1.53/responsiveslides.min.js"></script>
<script src="layout/scripts/custom.js"></script>

罪魁祸首文件是<script type="text/javascript" src="layout/scripts/jquery-mobilemenu.min.js"></script>;每次我禁用此行jQuery工作正常。我真的不确定在文件中识别什么会导致jQuery无法加载。 js的内容:

jQuery.noConflict()(function ($) {
    // Create the dropdown base
    $("<form id='mobilemenu'><select /></form>").appendTo("#topnav");
    // Create default option "Go to..." 
    $("<option />", {
        "selected": "selected",
        "value": "",
        "text": "Click For Menu"
    }).appendTo("#topnav select");
    //Populate dropdown with menu items
    $("#topnav a").each(function () {
        var el = $(this);
        var prefix = '';
        switch (el.parents().length) {
            case (6):
                prefix = '';
                break;
            case (8):
                prefix = '- - - ';
                break;
            case (10):
                prefix = '- - - - - ';
                break;
            case (12):
                prefix = '- - - - - - - ';
                break;
            default:
                prefix = '';
                break;
        }
        $("<option />", {
            "value": el.attr("href"),
            "text": prefix + el.text()
        }).appendTo("#topnav select");
        $("#topnav select").change(function () {
            window.location = $(this).find("option:selected").val();
        });
    });
});

有人能够通过更正此文件指出我正确的方向吗?我试图移动我的脚本加载的顺序,并且顺序无关紧要,当包含mobilemenu脚本时,jQuery不会加载。

1 个答案:

答案 0 :(得分:1)

在您提及的脚本中,您将看到调用noConflict()此方法允许jQuery与其他库一起使用,这些库也依赖于$作为入口点删除{ {1}}作为jQuery的别名。

$调用之后,您会立即看到一个非常具体的函数签名传递给jQuery:

noConflict()

jQuery将调用此函数,当它执行时它将作为(function ($) { //function code here }); 参数传递给自己,并且在该函数的范围内,您现在再次使用$访问jQuery。

因此,使用脚本的方式就需要按名称使用jQuery。

有关详细信息,请查看$上的documentation

关于noConflict还有其他几个问题,this one可能会有所帮助。