一些投入的问题

Question

有谁知道如何用HTML和JS制作这个http://prntscr.com/9z7pk？我制作了这张图片，这样你就可以更好地理解我的意思了。 我已经完成了2个多选输入，但我不知道如何在html中插入复选框。

提前致谢！

Answer 1

如果您发现自己在应用程序中有很多这些复杂的小部件，那么您应该查看像extJS这样的框架或其他类似的框架。它可以避免你的头痛，并且会阻止你重新发明已经被重新发明过多次的轮子。

Answer 2

不幸的是，多重选择不允许您将复选框或其他任意内容注入菜单项 - 它依赖于操作系统原生的多选热键（通常是移位和控制）。

您可以尝试将这两个项目设置为ol或ul列表，将文档项设置为li元素。每当您将项目添加到右侧列表时，请呈现新的li元素，并使用逗号分隔的所选项目列表更新<input type="hidden" />。

根据您希望交互的工作方式，您可以：

1. 如图所示实现添加/删除按钮，要求您自己在列表中实现多选。像extJS这样的小部件框架（如zi42所述）可以帮助解决这个问题。
2. 在左侧框中的所有项目旁边添加“添加”链接，在选择框中的所有项目旁边添加“删除”链接，但必填项目除外。
3. 处理双框，而是将复选框放在单个统一列表中的每个项目上，但强制项除外，这些项应具有已选中但已禁用的复选框输入。