1

我有点 JS 菜鸟。

这是一个粗略的例子,但它说明了我的问题。yepnope 运行良好,但它在堆栈顶部添加了 yep 脚本 (jquery.selectBoxIt.min.js)。问题是如果将加载的脚本放在它在 JQuery 库之前加载的堆栈的顶部。问题是它依赖于 jQuery 才能运行。我查看了 yepnope 文档,但没有看到任何提及它的内容。

这是我的代码(在我的文档底部:

<script src="js/jquery.js"></script>
<script src="js/jquery-ui-1.9.1.custom.min.js"></script>
<script src="js/jquery.infieldlabel.min.js"></script>
<script src="js/jquery.colorbox-min.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/jquery.validate.min.js"></script>
<script src="js/modernizr.js"></script>
<script type="text/javascript">
Modernizr.load([
    {
    // Let's check something simple
    test : Modernizr.borderradius,
    // this should then satisfy the yep and load this script
    yep : ['js/jquery.selectBoxIt.min.js']
    }
]);
</script>
</body>
4

3 回答 3

0

我本人对 Modernizr/yepnope 还很陌生,但是从yepnode 文档中我相信关键是使用 yepnope(或 Modernizr,它们是同一件事)以正确的顺序加载您需要的脚本,并且 yepnope 将确保它们按照您指定的顺序执行。

所以我相信你需要的是这样的:

<script src="js/modernizr.js"></script>
<script type="text/javascript">   

Modernizr.load([
    {
        // Load jQuery first
        load : ['js/jquery.js', 
                // ... and your other JS files
               ]
    },
    {
        // Let's check something simple
        test : Modernizr.borderradius,
        // this should then satisfy the yep and load this script
        yep : ['js/jquery.selectBoxIt.min.js']
    }
]);

</script>

还可以查看那些 yepnode 文档,了解他们尝试从 CDN 加载 jquery 并在加载失败时回退到本地副本的示例——这让我更清楚。

于 2013-03-22T20:20:28.617 回答
0

只需将上面的静态 JS 代码添加到函数中并将其放入 $(document).ready() - 这将确保在调用脚本时加载 jquery。如果这不可行,请尝试使用 javascript 加载 jquery,并在回调中放置静态 JS。请参阅动态加载 jQuery

于 2013-02-06T21:43:53.887 回答
0

在没有 jquery 的情况下做到这一点:

function init(){
  Modernizr.load([
  {
  test : Modernizr.borderradius,
  yep : ['js/jquery.selectBoxIt.min.js']
  }
  ]);
}
document.addEventListener('DOMContentLoaded', init, false)
于 2013-02-06T21:49:21.730 回答