替代使用 HTML Select答案

【问题标题】：Alternative to using HTML Select替代使用 HTML Select
【发布时间】：2010-09-22 16:36:19
【问题描述】：

我有一个带有各种 SELECT（多行和下拉列表样式）元素的 HTML 表单。 SELECT 中的许多项目比元素宽度宽得多。在大多数浏览器中，它会显示一个工具提示，并且下拉菜单将与最宽的选项一样宽。然而，在 IE6 中，这些都不起作用。

有谁知道任何替代控件，例如 jQuery 插件，可以用作 SELECT 替代品，允许工具提示和更广泛的下拉菜单。它只需要在IE6中工作。

【问题讨论】：

【解决方案1】：

您可以使用 CSS 指定 SELECT 元素的宽度以满足您的需要。

select { width: 150px; }

【讨论】：

【解决方案2】：

像jQuery Selectable 这样的东西怎么样。

在这里，您可以获得具有给定宽度的元素的可选列表。如果您想要更接近选择菜单的内容（即未列出所有内容），您可以查看下拉菜单类型实现，并对其进行修改以选择您的值，而不是导航到新页面。

【讨论】：

【解决方案3】：

我没有 IE6，所以如果你可以设置 select 元素的宽度，我不是 100%。如果你不能，你可以“重新创建”一个选择元素。如果 IE6 出现问题，我不会感到惊讶。

例如，为每个选项创建一个display: inline-blockdiv，然后循环遍历每个 div 并获取最大宽度。再次循环并将每个宽度设置为最高宽度。将它们保存在一个唯一的容器中（具有相同的宽度以确保它们包裹）并将它们放置在为此目的创建的元素旁边。不确定它对您的应用程序有多实用，但是呵呵。

详细来说，这就是我的意思：http://jsfiddle.net/Svkxc/

【讨论】：