0

在这里开发我的第一个 Rails 应用程序。试图让 jQuery 在我的视图中工作，据我所知，它应该简单地与我当前版本的 Rails 3.2.8 一起“开箱即用”。

这是我得到的：

  • 一个名为register#index的视图（带有一个名为“register”的控制器）：

    <head>
  <%= stylesheet_link_tag    "application", controller.controller_name %>
  <%= javascript_include_tag "application", controller.controller_name %>
</head>

  • 此视图正在加载两个 JS 文件：application.js和register.js

    应用程序.js：

    //= require jquery
//= require jquery_ujs
//= require twitter/bootstrap

    注册.js：

    $(document).ready(function(){
alert("Hello, jQuery!");
});

当我通过浏览器加载页面时，我可以看到包含的 jQuery.js 文件，并且我的register.js 已加载，现在已转换为：

(function() {

}).call(this);

呼叫丢失（并且alert()不会触发）。为什么这个是空白的？这是我的 gem 的问题，还是我的 jQuery 语法的问题？

一些额外的事情值得注意：

  • Gemfile 包括jquery-rails，我已经运行bundle install了rails g jquery:install
  • 即使我输入了 jQuery 以外的 jQuery alert()，函数体仍然显示为空白。
  • 我已经在每次测试之间清除了我的缓存。
  • 浏览器 (Chrome) 没有报告 JavaScript 错误
  • 此代码或多或少直接从 jQuery 教程中复制/粘贴。

编辑：添加了我的 javascript 标签如何包含在页面中。

4

3 回答 3

0

现在您只加载特定于每个控制器的 .js 文件。尝试更改您head以一次加载所有 .js 和 .css 文件，看看是否有帮助：

应用程序.html.erb 

<head>
  <%= stylesheet_link_tag "application-all", :media => "all" %>
  <%= javascript_include_tag "application" %>
</head>

您还需要更改应用程序 .js 以包含所有 .js 文件，如下所示：

应用程序.js

//= require jquery
//= require jquery_ujs
//= require twitter/bootstrap
//= require_tree .

如果这不起作用，请尝试将您的 javascript 从 .js 文件中移到您的视图中，以确保您正确安装了 jQuery。你会这样做：

<body>
  <script type="text/javascript">
    $(document).ready(function(){
      alert("Hello, jQuery!");
    });
  </script>
</body>
于 2012-10-17T20:47:29.573 回答
0

弄清楚了。

因此，即使 jQuery 被加载到我的application.js文件中，它也不在register.js文件使用的范围内（显然是并行加载的，可能是由于我在我的 .js 文件中引用它的方式javascript_include_tag。）

解决方案是确保 jQuery 在该额外register.js文件的范围内，方法是在加载 jQuery的register.js开头添加一个清单注释：

新修改的register.js文件：

//= require jquery
//= require jquery_ujs

$(document).ready(function(){

    alert('Hello, jQuery!');

});

注意：

碰巧我也在使用twitter-bootstrap-rails，它显然在其包中包含 jQuery。当我使用//= require jquery上面的包含时，虽然它有效，但它在浏览器中引发了错误：

Uncaught typeerror Object#<object> has no method 'popover'

为避免此错误，我包含了 twitter 引导参考并省略了其他 jQuery 参考。我的register.js文件结束时：

//= require twitter/bootstrap

$(document).ready(function(){

    alert('Hello, jQuery!');

});

希望这对以后遇到类似问题的人有所帮助！

  • 戴夫
于 2012-10-17T20:58:23.010 回答
0

请试试这个：

$(document).ready(function(){
   alert("Hello, jQuery!");
});

在 application.js 中使用此脚本。如果您收到警报，则表示您的 register.js 文件未正确包含。

于 2012-10-17T21:02:27.377 回答