Playframework 简单JS函数在Play框架中不起作用

我试图在我的Play应用程序中使用以下简单的javascript代码：

它可以在我的浏览器中使用，但不能在我的Play应用程序中使用，因为我有一些使用jQuery的动画菜单，这很好用。。 这是我的main.scala.html的结尾

    <script type="text/javascript" src="@routes.Assets.at("js/jquery.js")"></script>
    <script type="text/javascript" src="@routes.Assets.at("js/functions.js")"></script>

这两个脚本都位于public/js存储库中。 通过Firebug，我可以看到这两个脚本都加载到了我的浏览器中

我使用的是Play Framework和jQuery的最新版本

---

有什么想法吗？谢谢

这可能是一个时间问题-您使用的是

$（function（）{}）

或

.ready（）

？当我使用以下代码运行您的代码时，它可以工作（从coffeescript编译）：

我的视图如下所示-（您的目录名略有不同）：

单击测试1
单击测试2
单击测试3
单击测试4

我用这个代码解决了这个问题：

(function ($) {
  $(document).ready(function () {
    return $("span.deleteItem").bind('click', function () {
        $(this).closest('tr').find('td').fadeOut(1000, function () {
            return $(this).parents('tr:first').remove();
        });
        return false;
    });
  });
})(jQuery);

我在一篇博文中发现：

但是我不明白为什么前一个函数在游戏之外工作，为什么这个函数现在工作

---

有什么线索吗？

你能分享你视图中的字段定义吗（它们与JSFIDLE中的字段定义相同吗？）首先你要做的是检查错误控制台，可能它已经为你准备好了答案，或者至少有一些错误，我甚至不知道存在错误控制台。。通过使用此代码，我得到了一个“TypeError:$不是函数”：（function（）{return$（“span.deleteItem”）.bind（'click'，function（）{$（this）.closest（'tr'）.find（'td'）.fadeOut（1000，function（）{return$（this）.parents（'tr:first'）.remove（）；}）；return false；}）打电话给（这个）；谢谢你的帮助。我尝试了$（函数（）{}）；和.ready（），但仍然没有。我使用的代码与我在JSFIDLE中提供的代码完全相同，仅在标记中使用。我还尝试了与您在“functions.js”中给我的代码完全相同的代码。如果您在开始$（this）的行上设置断点（我使用的是chrome），它会启动吗？

<script type="text/javascript" src="@routes.Assets.at("javascripts/jquery.js")"></script>
<script type="text/javascript" src="@routes.Assets.at("javascripts/functions2.js")"></script>
<div>
  <table>
    <tr><td><span class="deleteItem">Click</span></td><td>Test 1</td></tr>
    <tr><td><span class="deleteItem">Click</span></td><td>Test 2</td></tr>
    <tr><td><span class="deleteItem">Click</span></td><td>Test 3</td></tr>
    <tr><td><span class="deleteItem">Click</span></td><td>Test 4</td></tr>
  </table>
</div>

(function ($) {
  $(document).ready(function () {
    return $("span.deleteItem").bind('click', function () {
        $(this).closest('tr').find('td').fadeOut(1000, function () {
            return $(this).parents('tr:first').remove();
        });
        return false;
    });
  });
})(jQuery);