如何创建一个带有进度条的下拉列表？

Question

有人知道如何在下拉/选择列表中显示进度条吗？

对于进度条，我使用的是 jQuery 的进度条： http://jqueryui.com/progressbar/

我试过搜索可用的插件，但它们只附加图片，比如 ddSlick http://designwithpc.com/Plugins/ddSlick 但是那种插件只附加静态图片

我要做的是一个下拉列表，列出了 10 个人，在他们的名字旁边应该有一个进度条显示他们的工作量

非常感谢！

编辑：添加 html

                      <select class="taskAssignUser" name="taskAssignUser">
                         <option value="">Select Member</option>
                        <c:forEach items="${getMemberList}" var="v">
                        <option value="${v.userId}" ${v.userId == u.taskAssignUser? 'selected':'' }>${v.username}</option>
                        </c:forEach>
                      </select>

Answer 1

你不需要真正的进度条插件，因为图形不会实时变化。

您可以做的是预先生成进度条图形 (JPEG/PNG/...)，然后为每个人显示相应的图形。你只需要生成，比如说，20 个不同的，每个占 5% 的进度块，除非你真的需要更高的粒度。

因此，您可以将这些静态图像与 ddSlick 或您想要使用的任何图形下拉菜单一起使用。