19

我将以下函数放在我的 application.js 中：

function test() {
  alert("See Me")
}

教室/_new_small.html.haml：

:javascript
  alert('test');
  test();

在我的 application.html.haml 我使用以下内容：

= javascript_include_tag 'application'

我的test is not defined萤火虫控制台出现错误。测试功能不应该在项目范围内可用，因为它在 application.js 文件中吗？谢谢

编辑：我正在通过 javascript 呈现页面。那会影响它吗？

$('#test_container').html("<%= escape_javascript(render :partial => 'classrooms/new_small') %>");
4

7 回答 7

28

假设您正在使用资产管道和咖啡脚本：不要在 application.js 中编写代码

为了保持干净的结构，创建一个文件夹（例如application：）app/assets/javascripts

然后在你的需要它application.js 

//= require jquery
//= require jquery_ujs

//= require_tree ./application

创建一个咖啡文件（例如：app/assets/javascripts/application/my_feature.js.coffee

@test = ->
  alert('Hello world')

咖啡输出：

(function() {

  this.test = function() {
    return alert('Hello world');
  };

}).call(this);

最好使用命名空间：

@myGreatFeature =
  test: ->
    alert('Hello world')

或者根据coffeescript FAQ，你可以写

namespace = (target, name, block) ->
  [target, name, block] = [(if typeof exports isnt 'undefined' then exports else window), arguments...] if arguments.length < 3
  top    = target
  target = target[item] or= {} for item in name.split '.'
  block target, top

namespace 'myGreatFeature', (exports) ->
  exports.test = ->
    alert('Hello world')

然后你可以myGreatFeature.test()到处打电话

于 2013-01-08T18:37:17.753 回答
1

我试过这个没有问题。这就是我的做法。

// 应用程序.js

var test=function(){
  alert("hello");
}

// 在视图中，无论哪一个，我都有一个 content_for :additional_javascripts

<% content_for :additional_javascripts do %>
  <%= javascript_tag do %>
    test();
  <% end %>
<% end %>

// 在应用程序布局中

<%= javascript_include_tag "application" %>
<%= yeild(:additional_javascripts) %>

此外，如果我想稍后动态地发出警报，我可以将它附加到页面然后调用它，或者将它放在点击侦听器或其他东西中。

我喜欢语法 var functionName = function(){...} 因为它正确地限定了方法的范围。此外，由于通过资产管道编译 javascripts 的方式，添加 ; 在每一个执行的行的末尾是非常重要的。

就动态加载脚本并从页面中的任何位置调用它而言，这也对我有用：

$("#click_me").live("click", function(){
  $("<script />").text("test();").appendTo("body");
});

在页面中我有一个简单的链接。

<a href="#" id="click_me">click</a>
于 2013-01-08T07:55:53.607 回答
1

简单的解决方案， remove escape_javascript，但很危险请参阅Why escape_javascript before rendering a partial？. 当前您要执行

$('#test_container').html("<script>
//<![CDATA[
 alert('test');
 test();
//]]>
</script>

这被转换成

$('#test_container').html("<script>\n  //<![CDATA[\n    alert(\'test\');\n    test();\n  //]]>\n<\/script>\n");

我该如何解决这个问题？

我将在 app/assets/javascripts/ 中包含 project_wide.js，然后告诉application.js包含我的文件。

//= require project_wide

一定要把上面的行放在后面

//= require jquery
//= require jquery_ujs

现在，我放入的任何app/assets/javascripts/project_wide.js内容都会无耻地出现在整个项目中，除了文件夹中的public/文件。在这个文件中，我将放置我想要执行的所有内容。

遵循惯例

目前，您正在直接在 classrooms/_new_small.html.haml其中添加 javascript，这并不常见。大多数情况下，rails 开发人员将这些东西放入assets/javascripts/*.js或调用content_for :javascript_custom视图中的块，这是通过在布局文件中添加的yield :javascript_custom

于 2013-01-04T10:20:27.880 回答
0

尝试使用：

<%= javascript_include_tag :all %>

在你的application.html.erb文件中

于 2013-01-02T03:35:27.300 回答
0

将所有这些 javascript 函数放在application.js文件中，并包含<%= javascript_include_tag 'application' %>在布局文件的head 标记中

于 2013-01-08T12:55:04.407 回答
0

我注意到你的函数test()是缩进的，这表明它是嵌套的。如果您在另一个函数的范围内定义一个函数，则它在它之外将不可用。

例如，这应该工作，使用 jQuery：

function test() { /* do something */ }

// another file or inline script

$(function() {
   test();
});

但这不会

(function() {
   function test() {}
})();

// another file

test(); // undefined
于 2013-01-02T03:45:51.303 回答
0

你可能在想这条线

= javascript_include_tag "application"

而不是

= stylesheet_link_tag 'application', :media => 'all'

如果缺少前者，则不会包含您的 javascript。

于 2012-12-31T00:57:22.317 回答