Rails应用程序没有显示raty js插件

时间:2017-10-03 21:38:05

标签: javascript jquery ruby-on-rails ruby raty

使用raty js获取这些错误我正在使用Rails 5.0版

jquery.raty.self-628421be04f36f7a8fa8b9b884c6d7824d6f8bdeba4f172b131f15aa63f713e8.js?body=1:761 Uncaught ReferenceError: jQuery is not defined
    at jquery.raty.self-628421be04f36f7a8fa8b9b884c6d7824d6f8bdeba4f172b131f15aa63f713e8.js?body=1:761
(anonymous) @ jquery.raty.self-628421be04f36f7a8fa8b9b884c6d7824d6f8bdeba4f172b131f15aa63f713e8.js?body=1:761
2:131 Uncaught TypeError: $(...).raty is not a function
    at 2:131

我添加raty JS插件的代码如下。

<script>
$('.review-rating').raty({
    readOnly: true,
    score: function() {
        return $(this).attr('data-score');
    },
    path: '/assets/'
});

这与我的show.html.erb文件相对应,显示我的评论部分

<div class="review-rating" data-score="<%= review.rating %>"></div>
<p><%= review.comment %></p>


 <% if user_signed_in? %>

<% if review.user_id == current_user.id %>

<%= link_to "Edit", edit_book_review_path(review.book, review) %>
<%= link_to "Delete", book_review_path(review.book, review), method: :delete, data: {
confirm: "Are you sure?" } %>

<% end %>
<% end %>

jQuery肯定在应用程序中,因为我添加了它&amp;我正在使用bootstrap的某些元素需要jQuery,这些元素都运行良好。

我已将Raty的图像添加到app / assets / images路径以及raty js文件到javascripts文件夹。

任何洞察为什么Rails不读Raty ???

谢谢

2 个答案:

答案 0 :(得分:0)

看起来raty库未加载,但您尝试初始化它。将代码包装到$(document).ready

$(document).ready(function() {
  $('.review-rating').raty({
      readOnly: true,
      score: function() {
          return $(this).attr('data-score');
      },
      path: '/assets/'
  });
});

答案 1 :(得分:0)

我明白了。 首先,将其添加到application.js文件的顶部

//= require jquery3
//= require jquery_ujs
//= require jquery.raty

接下来,将你的show.html.erb视图中的js代码包装在$(document).ready中,如下所示:

$(document).ready(function() {
   $('.review-rating').raty({
   readOnly: true,
   score: function() {
     return $(this).attr('data-score');
   },
   path: '/assets/'
   });
});

最后,添加

<script src="/assets/jquery.js" type="text/javascript"></script>
<script src="/assets/jquery_ujs.js" type="text/javascript"></script>

application.html.erb以上的<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>

这可以解决问题,你应该看到评论明星!