Javascript jquery在rails中不工作_Javascript_Jquery_Ruby On Rails

Javascript jquery在rails中不工作

javascript jquery ruby-on-rails

Javascript jquery在rails中不工作,javascript,jquery,ruby-on-rails,Javascript,Jquery,Ruby On Rails,我已经阅读了很多关于在rails中使用jquery的页面，但似乎仍然无法让它发挥作用我已经安装了“jquery rails”gem。我在application.js文件中有require语句以下是我一直运行的测试页面： <!DOCTYPE html> <html> <head> <title><%= yield(:title)%></title> <%= javascript_include_tag 'app

我已经阅读了很多关于在rails中使用jquery的页面，但似乎仍然无法让它发挥作用

我已经安装了“jquery rails”gem。我在application.js文件中有require语句

以下是我一直运行的测试页面：

<!DOCTYPE html>
 <html>
 <head>
<title><%= yield(:title)%></title>
<%= javascript_include_tag 'application','jquery', 'data-turbolinks-track' => true  %>
<%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
<script>$(document).ready(function(){
  $(".bg-info").click(function(){
    $(this).hide();
});
 });</script>
</head>
<body>
<center>
<h1 class="bg-info"><%= yield(:title)%></h1>
</center>
</body>
</html>


正确%>
正确%>
$（文档）.ready（函数（）{
$（“.bg info”）。单击（函数（）{
$（this.hide（）；
});
});

但是，当我在浏览器中单击“bg信息”文本时，我没有得到任何响应。

以下是您应该拥有的内容：

下面是我对布局（要测试）所做的：

#app/views/layouts/application.html.erb
正确%>
正确%>

如果上面的内容不符合要求，那么您的（操作系统）可能会出现问题——很可能是操作系统出现问题

要确认这一点，您需要调试您的：

要访问开发人员控制台，

右键单击>检查元素>控制台

这将显示JS和前端环境中的任何错误。如果出现任何错误，他们可能会告诉您问题所在

如果没有出现错误，您应该，因为这样可以确保Rails可以使用适当的JS可执行文件。

这是一个延伸，但在

资产/javascripts/application.JS

中，您是否有以下行：

/=require jquery

。或者可能是

bundle安装

？您可以尝试以下操作：

true%>

。从该行中删除

jquery

，重新启动服务器，然后尝试运行

rake资产：clobber

。可能存在某些资产缓存问题打开浏览器中的开发者控制台并尝试执行$（“.bg info”）。长度（在bg info所在的页面上）是否可以包含

应用程序.js

文件？devlooper的控制台+1

#app/assets/javascripts/application.js
//= require jquery
//= require jquery_ujs
//= require_tree .

$(document).on("click", ".bg-info", function(e){
   $(this).hide();
});

#app/views/layouts/application.html.erb
<!DOCTYPE html>
 <html>
   <head>
       <title><%= yield(:title)%></title>
       <%= javascript_include_tag 'application','jquery', 'data-turbolinks-track' => true  %>
       <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
       <%= csrf_meta_tags %>
   </head>
   <body>
       <div class="bg-info"><%= yield(:title)%></div>
   </body>
</html>