0

所以在Assets文件夹中有两个文件夹javascripts和stylesheets。所以我在这些文件夹中添加了一个spike.js和一个 CSS 文件，spikecss.css并为它们编写了一些 Javascript 和 CSS 代码。

现在我在 index.html 页面中写这样的东西？这是行不通的。我如何将所有这些东西连接在一起工作？

这是一个测试应用程序，主要用于交易的 javascript 方面，所以我现在真的没有模型、控制器和视图。我在 JavaScript 文件中绘制 D3 图表，所以我只想在点击网页时显示它们

Javascript 文件：

var data = [4, 8, 15, 16, 23, 42];

var chart = d3.select("body").append("div")
    .attr("class", "chart");

chart.selectAll(chart)
    .data(data)
    .enter().append("div")
    .style("width", function(d){return d*5 +"px";});

索引.html 文件：

<!DOCTYPE html>
<html>
<head>
    <title>Here we go</title>
</head>
<body>

javascript_include_tag :defaults, "spike"

</body>
</html>
4

1 回答 1

1

更新

根据此railscast中使用的 Ryan 方法，您只需这两个步骤即可拥有一个动态index.html.erb页面（原始的，稍微复杂一点的答案如下所示）：

首先，将您的 routes.rb 文件设置为如下所示：

MyApplication::Application.routes.draw do
  root to: 'application#index'
end

接下来，将您的/public/index.html文件移动到/app/views/application/index.html.erb. 不要只是复制它——移动它。这意味着您的目录中不应有 index.html 文件/public。

恭喜，您现在拥有一个可以处理 ERB 标记的动态索引页面。

原始答案

该/public/index.html文件是静态提供的，因此您需要像不使用 Rails 一样编写它。将您的 css 和 javascript 位置添加到该<head>部分，分别使用<link>和 ，<script>就像您对任何普通 HTML 页面所做的那样。

如果您更喜欢使用 Rails 方式执行此操作，则至少需要：

  • 进入routes.rb
  • 对应的空控制器
  • 和一个与您的控制器名称相同 的index.html文件（或index.html.erb、index.html.haml等） （减去“控制器”一词）。/app/views/some_name/some_name

然后，您可以将自定义文件名添加到您的/app/assets/javascript/application.js和/app/assets/stylesheets/application.css清单中，以将它们拉入页面。

或者，您可以/app/views/layouts/application.html.erb使用嵌入式 ruby​​ 手动编辑模板。有关如何执行此操作的文档，请参见此处和此处。

哦，还有一件事——你写的 javascript 将在 DOM 加载之前执行，就像现在一样。为避免这种情况，您需要使用以下内容包装它：

$(function(){ /* your code here */ });
于 2013-04-10T18:03:03.477 回答