JQuery (документ) .Не работает в рабочей Rails 5

Question

В настоящее время я разрабатываю простую систему оценки по звездам с использованием jquery на Rails 5. Она отлично работает в разработке, но не в производстве.

Однако, когда я включаю config.assets.debug = true в /config/production.rb, это работает. Одна из причин, по которой я подозреваю, что он так себя ведет, заключается в том, что прекомпиляция application.js как-то сделала jQuery (document).on неработающим. Я застрял с этим в течение нескольких дней, и не смог найти никакого решения онлайн.

Просто интересно, возможно ли, что в application.js есть конфликт? Есть ли необходимость в jQuery.noConflict() функции?

Благодарим вас за помощь в этом. Ниже приведен весь соответствующий код для справки.

application.js

//= require jquery
//= require jquery_ujs
//= require bootstrap/js/bootstrap.bundle
//= require activestorage
//= require Chart.bundle
//= require chartkick
//= require turbolinks
//= require turbolinks-compatibility

// Start for AGENCY
//= require js_agency/jqBootstrapValidation
//= require js_agency/contact_me
//= require js_agency/agency.min
// End for AGENCY

//START FOR ADMIN
//= require jquery_sb-admin/jquery
//= require jquery-easing_sb-admin/jquery.easing
//= require chart.js/Chart.min
//= require datatables/jquery.dataTables
//= require datatables/dataTables.bootstrap4
//= require js_sb-admin/sb-admin.min
//= require js_sb-admin/demo/datatables-demo
//= require js_sb-admin/demo/chart-area-demo
//END FOR ADMIN
//= require_self
//= require_tree .


$(document).on('turbolinks:load',function(){
    $('.rating-star').click(function(){
        var star = $(this);
        var data_form = $(this).attr('data-form');
        var data_field = $(this).attr('data-field');
        var stars = $(this).attr('data-stars');

        for (i=1;i<=5;i++){
            if(i <= stars){
                $('#' + 'rating' + '_' + data_form + '_' + i).removeClass('glyphicon glyphicon-star-empty');
                $('#' + 'rating' + '_' + data_form + '_' + i).addClass('glyphicon glyphicon-star');
            } else {
                $('#' + 'rating' + '_' + data_form + '_' + i).removeClass('glyphicon glyphicon-star');
                $('#' + 'rating' + '_' + data_form + '_' + i).addClass('glyphicon glyphicon-star-empty');
            }
        }
        $('#' + data_field).val(stars);
        $('#' + 'feedback').val(stars);
    });
});

/ вид / звезда / star_rating.html.erb

<div class="col-md-12">
  <% data_form = "Taska_try" %>
  <% data_field = "taska_rating" %> <!--the field for the stars -->
    <% (1..5).each do |i| %>
      <h1 id="rating_<%= data_form %>_<%= i %>" 
          data-form="<%= data_form %>" 
          data-stars="<%= i %>" 
          data-field="<%= data_field %>"
          class="rating-star glyphicon glyphicon-star-empty">
      </h1>
    <% end %>    
</div>

<div class="col-md-12">
  <% data_form = "Classroom_try" %>
  <% data_field = "classroom_rating" %> <!--the field for the stars -->
    <% (1..5).each do |i| %>
      <h1 id="rating_<%= data_form %>_<%= i %>" 
          data-form="<%= data_form %>" 
          data-stars="<%= i %>" 
          data-field="<%= data_field %>"
          class="rating-star glyphicon glyphicon-star-empty">
      </h1>
    <% end %>
</div>

Answer 1

Я не знаю причину, но решение простое

Просто клонируйте функцию jquery перед загрузкой любого сценария в проект и затем используйте его, когда вам это нужно.

$(document).ready(function() {

    myDocOn = $(document).on();

      myDocOn.on("mousemove",
            function() {
                // refeshMyTime();

            }
        )

    )};

Независимо от того, что происходит с исходной функцией в любом mdoification другим скриптом, ваша функция будет сохранена.

Этот код работает для меня.

¿Почему у меня отрицательная точка?

Я больше не могу ответить только этим = (пожалуйста, помогите мне.

Answer 2

Я нигде не вижу, чтобы вы вызывали пользовательское событие turbolinks:load. Итак, я думаю, вам нужно просто:

$(document).on('load'

Вместо:

$(document).on('turbolinks:load'

Или, если вы хотите, вы можете вызвать пользовательское событие где-нибудь:

var turbolinks = jQuery.Event('turbolinks:load');
$(document).trigger(turbolinks);

Или просто вызвать как:

$(document).trigger('turbolinks:load');