java - 在 play framework 2.0 中使用 jquery

Question

我想使用 jQuery 打开灯箱，但它导致了问题。 这是我的 Application.java 代码:

    @(products: List[Products])

    @import helper._

        <script type="text/javascript" src="../public/javascripts/jquery-1.7.2.min.js"></script>
        <!-- Add mousewheel plugin (this is optional) -->
        <script type="text/javascript" src="../public/javascripts/jquery.mousewheel-3.0.6.pack.js"></script>

        <!-- Add fancyBox main JS and CSS files -->
        <script type="text/javascript" src="../public/javascripts/jquery.fancybox.js?v=2.0.6"></script>
        <link rel="stylesheet" type="text/css" href="../public/stylesheets/jquery.fancybox.css?v=2.0.6" media="screen" />


        <script type="text/javascript">
        $(document).ready(function() {

$('.fancybox').fancybox();

// my code
           });
// rest of the code

它给了我错误

ReferenceError: $ is not defined 显示在 Firebug 中。 我什至尝试用 jQuery 更改 $ 但它仍然根本不起作用。我还看到 jQuery 被加载到 head 部分。 请帮我解决这个问题。

conf/路由文件:

# Routes
# This file defines all application routes (Higher priority routes first)
# ~~~~

# Home page
#GET     /                           controllers.Application.index()

# Map static resources from the /public folder to the /assets URL path
GET     /assets/*file               controllers.Assets.at(path="/public", file)

# Products list (to fetch the list of all the products)
GET     /products                controllers.Application.list

GET     /products/:id           controllers.Application.findAll1(id:Integer)

Answer 1

我认为你的 JS 路径是错误的。

如果您使用默认的 Play 配置，您的 Javascript 路径应该如下所示:

<script type="text/javascript" src="/assets/javascripts/jquery-1.7.2.min.js"></script>
...

更好的是，使用反向路由，你应该使用:

<script type="text/javascript" src="@routes.Assets.at("/javascripts/jquery-1.7.2.min.js")"></script>
...

静态资源是通过在您的 conf/routes 文件中定义的特殊路由提供的:

# Map static resources from the /public folder to the /assets URL path
GET     /assets/*file               controllers.Assets.at(path="/public", file)

此路由只是在您的本地 public 文件夹和 /assets 网址之间建立绑定(bind)。