语义用户界面滑块javascript不工作

我正在为我的rails应用程序测试一个新的应用程序，但它不起作用，图像堆叠在彼此的顶部

<div class="slider slider1">
    <div class="slides">
      <div class="slide-item item1">
      </div>
      <div class="slide-item item2"> 
      </div>
      <div class="slide-item item3">
      </div>
      <div class="slide-item item4">
      </div>
  </div>
</div>

---

我已经在我的应用程序中安装了必要的gems和所需的语义ui。js

假设在您的示例中，您从外部资源添加了滑块库

 $('.slider').glide({
      autoplay: false,
      arrowsWrapperClass: 'slider-arrows',
      arrowRightText: '',
      arrowLeftText: ''
    });

只需将此脚本添加到应用程序布局中

javascript_include_tag "https://cdn.jsdelivr.net/jquery.glide/1.0.6/jquery.glide.min.js"

使用以下html填充您的代码：

<script src="https://cdn.jsdelivr.net/jquery.glide/1.0.6/jquery.glide.min.js"></script>

或者，如果您使用的是

turbolinks

，请将其包装为：

$(document).on('turbolinks:load', function() {
  $('.slider').glide({
    autoplay: false,
    arrowsWrapperClass: 'slider-arrows',
    arrowRightText: '',
    arrowLeftText: ''
  });
});

---

请参阅控制台错误Rails console not showing any errors@shubh浏览器控制台我的意思是这里的错误是“TypeError:$（…）。glide不是一个函数”您没有包括js库或它没有被加载，其中的

glide（）

是defined@sokoine我更新了我的答案，重新加载了额外的js，所有东西都消失了，在web控制台中，我得到了一个错误“jQuery未定义”@sokoine您是否安装了

jQuery rails

并且是必需的？将//=require jQuery置于/=require\u树之上。在my application.js中，修复了web控制台中显示的所有错误，但是图像滑块仍然不工作，图像仍然堆叠在每个屏幕的顶部other@sokoine样式表呢？在application.css中也需要它们吗？

$(document).on('turbolinks:load', function() {
  $('.slider').glide({
    autoplay: false,
    arrowsWrapperClass: 'slider-arrows',
    arrowRightText: '',
    arrowLeftText: ''
  });
});