jquery UI只有一项是可拖动的

在我的Rails应用程序中，用户选择一系列“植物”对象后，这些植物的图像将显示出来，并且需要“可拖动”。问题是，只有第一个出现的植物是可拖动的，无论我是尝试使用Ruby还是div id。我不知道出了什么问题，甚至生成的HTML页面源代码看起来也应该正常工作。我在这里发现了一个类似的问题与解答：，但解决方案不适用于我的代码

在my application.js中：

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

在我看来，这只会使第一个图像显示为“可拖动”：

“可拖动的”：大小=>“50x50”）%>

使用div或li id也可以执行相同的操作：

<% @plants.each do |plant| %>  
  <li id="draggable">                         
     <%= image_tag(plant.image_path, :size => "50x50")%>       
  </li>
<% end %>      

“50x50”）%%>

---

HTML页面源代码表明每个项目都有一个可拖动的id，但仍然只有第一个项目确实是可拖动的。我最初认为DragTable与Rails“each”函数不兼容，但事实证明，除了第一个plant对象之外，我无法使视图中的任何其他图像可拖动。请帮帮我。我不知道这是我的javascript的一个bug还是一个问题，我对Jquery是相当陌生的。

id应该是每页唯一的（因此它只取第一项），尝试给元素一个可拖动的类。

id应该是每页唯一的（因此它只取第一项），尝试给元素一个可拖动的类。

我现在看到的答案与您所指的问题大致相同，但现在我想知道您在尝试该解决方案时到底尝试了什么。啊，明白了。我回到最初的问答环节，意识到我从未添加CSS。谢谢，约翰。我现在看到的答案和你提到的问题差不多，但现在我想知道你在尝试这个解决方案时到底尝试了什么。啊，明白了。我回到最初的问答环节，意识到我从未添加CSS。谢谢你，约翰。

<% @plants.each do |plant| %>  
  <li id="draggable">                         
     <%= image_tag(plant.image_path, :size => "50x50")%>       
  </li>
<% end %>