Question

我正在使用Typesafe Activator 1.2.10并尝试WebJars Sample for Play 2.x。我查看应用程序模板并阅读 Bootstrap依赖于jQuery。因此，当您将Bootstrap指定为依赖项时，您也会在测试页中获得jQuery。。

好的，我想我现在可以使用jQuery了 - 让我们通过将以下最小代码添加到index.scala.html（在<div class="container">内）来尝试：

<script type="text/javascript">
  $('.container').hide();
</script>

没有，Safari投诉ReferenceError: Can't find variable: $。如果我在Safari的命令行中尝试相同的代码，它可以工作 - 所以jQuery不会立即加载，但过了一段时间它就在那里。

我读了一些关于RequireJS用法的内容并尝试以下内容：

<script type="text/javascript">
  require(["jquery"], function() {
    $('.container').hide();
  });
</script>

现在我从Safari中收到以下错误：

[Error] Failed to load resource: the server responded with a status of 404 (Not Found) (jquery.js, line 0)
[Error] Failed to load resource: the server responded with a status of 404 (Not Found) (jquery.js, line 0)
[Error] Error: Script error for: jquery
http://requirejs.org/docs/errors.html#scripterror

最后，我打开index.coffee中的app/assets脚本，然后尝试：

require ["bootstrap"], () ->
  console.log "boostrap javascript loaded"
  $('.container').hide()

终于胜利了！但是在外部文件中编写所有jQuery代码真的很讨厌。如何在HTML模板中使jQuery工作？我如何封装代码，以便只在jQuery被RequireJS加载后执行？谢谢！

Answer 1

使用WebJars进行依赖关系管理会将传递依赖关系引入项目，但这并不意味着它们会神奇地加载到页面中。所以如果你想使用jQuery，那么你需要加载它。您可以使用WebJars中的RequireJS支持来加载传递依赖项（如您所发现的）。如果您只想将jQuery加载到index.scala.html页面，请执行以下操作：

<script type='text/javascript' src='@routes.WebJarAssets.at(WebJarAssets.locate("jquery.min.js"))'></script>

WebJars文档中的更多详细信息：http://www.webjars.org/documentation

在Play Framework WebJars示例应用程序中使用jQuery

1 个答案: