如何在Ruby on Rails中使用Javascript？ [英] How to use Javascript in Ruby on Rails?

问题描述

我认为我从根本上误解了如何在我的rails应用程序中实现Javascript。我的理解是你把你的Javascript扔进你的 application.js 文件然后你可以使用 jQuery 为了制作一个交互式网页。

I think I'm fundamentally misunderstanding how to implement Javascript in my rails app. My understanding was that you throw your Javascript into your application.js file and then you can reference elements in your DOM using jQuery in order to make an interactive web page.

我刚检查了所有代码，看起来很干净（如果我错了，请在下面发布）。我的想法是我可能把我的Javascript放在错误的地方，或者我在某个地方错过了依赖？我发现其他帖子对我来说几乎无益。如何将Javascript合并到我的应用程序中？

I just checked through all of my code, and it looks clean (posted below in case I'm wrong). My thought is that I may be putting my Javascript in the wrong place, or I'm missing a dependency somewhere? I found other posts to be mostly unhelpful for me. How do I merge Javascript into my app?

application.js

function main() {
  $('.answers-box').hide();
  $('.qaa-box').on('click', function() {
    $(this).next().slideToggle(400);
  });
}
$(document).ready(main());

page.html.erb

<div class="qaa-box">
  <h4>Lorem ipsum dolor sit amet, consectetur adipiscing elit</h4>
  <p class="answers-box">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit
  </p>
</div>

推荐答案

你找到了这个吗？

将JavaScript放在哪里。

在哪里坚持你的JavaScript

是否使用Rails资产管道或直接向视图添加< script> 标记，您必须选择放置任何本地JavaScript文件的位置。

Whether you use the Rails asset pipeline or add a <script> tag directly to a view, you have to make a choice about where to put any local JavaScript file.

我们可以为本地JavaScript文件选择三个位置：

We have a choice of three locations for a local JavaScript file:

• app / assets / javascripts 文件夹


• lib / assets / javascripts 文件夹


• 供应商/资产/ javascripts 文件夹

• the app/assets/javascripts folder
• the lib/assets/javascripts folder
• the vendor/assets/javascripts folder

以下是指南，用于选择脚本的位置：

Here are guidelines for selecting a location for your scripts:

• 使用 app / assets / javascripts 用于为应用程序创建的JavaScript。


• 对于许多应用程序共享的脚本使用 lib / assets / javascripts （但如果可以，请使用gem） 。


• 使用 vendor / assets / javascripts 获取来自其他开发人员的jQuery插件等的副本。

• Use app/assets/javascripts for JavaScript you create for your application.
• Use lib/assets/javascripts for scripts that are shared by many applications (but use a gem if you can).
• Use vendor/assets/javascripts for copies of jQuery plugins, etc., from other developers.

在最简单的情况下，当所有JavaScript文件都在应用程序中时/ assets / javascripts 文件夹，您无需做任何其他事情。

In the simplest case, when all your JavaScript files are in the app/assets/javascripts folder, there’s nothing more you need to do.

在其他地方添加JavaScript文件，您需要了解如何修改清单文件。

Add JavaScript files anywhere else and you will need to understand how to modify a manifest file.

神秘清单

JavaScript资源文件夹中有两种文件：

Mysterious Manifests
There are two kinds of files in a JavaScript assets folder:

• 普通JavaScript文件


• 清单文件
  
  您还可以 CoffeeScript 文件和 ERB 文件，它们是普通 JavaScript文件的变体。

• ordinary JavaScript files
• manifest files
  You can also have CoffeeScript files and ERB files which are variations on ordinary JavaScript files.

Manifest 文件与普通JavaScript文件具有相同的.js文件扩展名。清单文件和普通JavaScript文件可以组合在一个文件中。这使得清单文件神秘，或者至少是非显而易见的。

Manifest files have the same .js file extension as ordinary JavaScript files. Manifest files and ordinary JavaScript files can be combined in a single file. This makes manifest files mysterious, or at least non-obvious.

默认 app / assets / javascripts / application.js file是清单文件。它是一个清单文件，因为它包含指令：

The default app/assets/javascripts/application.js file is a manifest file. It’s a manifest file because it contains directives:

//= require jquery  
//= require jquery_ujs  
//= require_tree .

指令告诉Sprockets应该合并哪些文件来构建单个JavaScript脚本。包含清单指令的每个文件都将成为与原始清单文件同名的单个JavaScript脚本。因此 app / assets / javascripts / application.js 清单文件变为 application.js script。

Directives tell Sprockets which files should be combined to build a single JavaScript script. Each file that contains manifest directives becomes a single JavaScript script with the same name as the original manifest file. Thus the app/assets/javascripts/application.js manifest file becomes the application.js script.

app / assets / javascripts 文件夹中的所有脚本都会自动添加到默认<$ c当清单文件包含默认的 // = require_tree。指令时，$ c> application.js 脚本。

All scripts in the app/assets/javascripts folder are automatically added to the default application.js script when the manifest file includes the default //= require_tree . directive.

希望这会有所帮助。

这篇关于如何在Ruby on Rails中使用Javascript？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！