从选择框中拖动所有选定元素的副本——可能吗？

Question

我有一个选择列表 Web 界面：一对选择元素，它们之间有一对按钮（一个向左箭头和一个向右箭头）。用户可以在两列之间移动项目，例如，选择左列中的一个选项并单击向右箭头。

现在我有一个增强请求：有人希望能够在两列之间拖放项目，而不是单击按钮。我最初的两个选择框设置的问题是，只要我单击一个突出显示的选项来启动拖动，所有其他选定的选项都会被取消选择。使用 jQuery，我已将 mousedown 事件处理程序附加到选择框和仅在事件对象上调用 preventDefault() 的每个单独选项，但这还不够。在 Firefox 3 上，点击选项立即失去焦点，但所有其他选项仍被删除，而在 IE6（遗憾的是我仍然必须支持）上它根本没有区别。

所以我想我可以使用列表元素或 div 或其他东西创建一个合理的选择框复制品。我可以创建一些在 Firefox 上工作的看起来合理的东西，但是在 IE6 上，如果我按住 shift 键单击伪选择对象的一个​​元素（以选择一系列选项），IE 会选择我所在位置之间的所有文本点击和我点击的最后一个地方。同样，我已将 preventDefault-ing mousedown、mouseup 和 click 处理程序附加到所有涉及的元素，但这没有帮助。

我什至尝试在我的原始选择框和伪选择对象上覆盖透明 div，想拦截鼠标点击并手动管理选择，但我无法让它在 IE 上运行。如果我使用选择框，我无法阻止点击更改选择，如果我使用看起来像选择元素的文本，我无法阻止它在 shift-click 上选择文本范围。

是否有一些通用的解决方案，或者我只是运气不好？

Answer 1

查看带有两个连接的可排序列表的 Jquery UI 可排序：http://jqueryui.com/demos/sortable/#connect-lists

只是：

    $('.selector').sortable({ connectWith: '.otherlist' });

Answer 2

我最终选择了“不可选择”属性。