javascript - 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>

我的 appllication.js

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

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

应用程序.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 中测试。

我尝试预编译 Assets ，清理所有旧 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();
});

在调用 draggable 之前加载 DOM 以完全加载。