jQuery UI可排序选择选项

Question

我想让jQuery UI默认的可排序功能在选择多选列表框中的选项上工作，但似乎无法使其正常工作。这可以使用选项吗？我只看到过到处都是<li>的示例。 以下是我的JavaScript代码: $(function() { $( "#secondSelectms2side__dx" ).sortable(); $( "#secondSelectms2side__dx" ).disableSelection(); }); 并且HTML： <select title="" name="secondSelectms2side__dx" id="secondSelectms2side__dx" size="8" multiple="multiple"> <option value="4">asdsdsds</option> <option value="10">bsdsdsdsd</option> <option value="2">csdsdsds</option> </select>​ 我的代码在jsFiddle上: http://jsfiddle.net/noscirre/DRUPe/ （注：无需翻译）

- user1038814

---

我从未尝试过，但我非常确定你无法在select元素上执行此操作。但是，您可以使用jQuery将选项拆分为ul / li排列，然后在那里进行多选+可排序。 - Ben Everard

@user1038814，我可以给您提供一个带有多选和可排序功能的“select”框架的工作演示。如果您感兴趣，我已经为您准备好了演示文稿。 - Tats_innit

@Tats_innit 好的，请帮我翻译一下，谢谢。 - user1038814

@user1038814，好的，给我2分钟，马上见！ - Tats_innit

Answer 1

使用multiselect js小部件实现选项排序的工作示例：http://jsfiddle.net/QRv6d/9/

好的链接：https://github.com/yanickrochon/jquery.uix.multiselect http://quasipartikel.at/2009/05/10/jqueryui-multiselect/ & http://quasipartikel.at/multiselect/

请注意：我无法找到任何简单的sortable()实现与一起使用，因此使用此multiselect插件，如您在演示中所见，它确实可以正常工作:)您可以根据需要使用它。完整的HTML代码在js fiddle中。 希望这可以帮到您, 脚本来源 <script type="text/javascript" src="http://quasipartikel.at/multiselect/js/ui.multiselect.js"></script> 代码 $(function(){ $(".multiselect").multiselect(); });​ HTML <select id="countries" class="multiselect" multiple="multiple"> <option value="AUT" selected="selected">Austria</option> <option value="DEU" selected="selected">Germany</option> <option value="NLD" selected="selected">Netherlands</option> <option value="USA" selected="selected">United States</option> </select> 图像

- Tats_innit

---

谢谢你。我会尝试适应它的。干杯 - user1038814

死链 @Tats_innit - Howie

嘿，Howie兄弟。我已经更新了链接，会看一下演示，但你也可以查看git存储库来了解情况。 - Tats_innit

Answer 2

这就是你需要的。如果你想要自定义样式，使其看起来像传统的选择框，你需要做一些额外的工作。我正在将其与simple_form集成，并将在此处发布代码。

https://github.com/thgreasi/ui-sortable-multiselection

- Ashley Raiteri