jquery ui 不适用于 rails 4

Question

使用 jQuery UI 和 rails 4.2.3。它对我不起作用。

使用gem"jquery-ui-rails".

试着做一个像这样的简单的可拖动元素https://jqueryui.com/draggable/#default

但是我无法移动 div 元素。

<div id = "draggable" class="ui-widget-content">
  <p>Element</p>
</div>

我的apllication.js

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require twitter/bootstrap
//= require turbolinks
//= require_tree .

$("#draggable").draggable();

apllication.css

*= require jquery-ui
*= require_tree .
*= require_self
 */

#draggable{width:110px;height:100px; padding:0.5em; border:1px solid #ddd; background-color:#eee}

在 Firefox 和 Chrome 中测试。

我尝试预编译资产，清理了所有旧的 gem。并尝试手动插入布局（当我这样做时，我删除了 application.js 中的 jquery 行）

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

浏览器没有显示任何错误。在浏览器中使用开发工具时，我可以在 assets/jquery-ui 中看到所有 jquery-ui 文件。

求助。我的错误在哪里？

Answer 1

问题很可能是您在 DOM 完全加载之前尝试运行代码，因此它甚至找不到 $("#draggable")。改变

$("#draggable").draggable();

至

$(function() {
  $("#draggable").draggable();
});

它将加载 DOM 以在调用 draggable.

之前完全加载

jquery ui 不适用于 rails 4

jquery ui doesn't work with rails 4

javascript

jquery

jquery-ui

ruby-on-rails

ruby-on-rails-4.2