PHP 中的下拉菜单

Question

我在 SUN OS 服务器上使用 PHP 5.2。以下下拉菜单代码出现问题：

echo '<form action="" method="get">';
echo '<p>Information:<br />';
echo '<select name="acctno" style="width: 100px;">';
foreach ($this->account_names as $acctno => $acctname) {
   echo '<option value="'.$acctno.'">'.$acctname.'</option>';
   }
echo '</select> <input type="submit" value="view" />';
echo '</form>';

在 Firefox 和 Chrome 上工作得非常好；但是 Internet Explorer 存在问题。

在 IE 中，下拉菜单宽度限制为 100px。因此始终只显示帐户名的前 15-16 个字符。然而，在 Chrome 或 Firefox 中，即使最初只显示 15-16 个字符，当单击下拉箭头时，它也会显示整个名称（无论多长）。 IE 不会出现这种情况。因此，如果帐户名是“1223456789abcdefghijkl”，那么： 对于 IE：始终仅显示“123456789” F 对于 chrome 或 firefox：显示“123456789”，下拉时显示全名“123456789abcdefghijkl”。任何帮助将不胜感激。

谢谢， 副总裁

Answer 1

这不是 PHP 问题，而是 CSS 问题。

因为我假设它正确地呈现了代码，并且这只在一个浏览器中被破坏，所以这是一个您必须诊断的浏览器特定错误。如果您发布网站链接或 CSS/HTML 输出，这将有助于我们为您提供帮助。

Answer 2

这个问题与PHP无关，只与CSS和HTML有关。主要原因是标准（故意）没有准确指定下拉控件应如何工作。如果您查看标准，它甚至没有强制使用 根本没有下拉框。即使 HTML 5 标准草案也没有指定如何实现强制功能。如果浏览器实现者愿意，该标准允许控件在全屏 3D 立方体上显示所有选项，只要它允许选择一个选项即可。

如果您想精确控制下拉菜单的外观，则必须使用 JavaScript 创建一个下拉菜单并伪造其功能。

Answer 3

这是IE浏览器的问题。它无法用 css 修复，但可以使用 javascript 修复它。

http://css-tricks.com/select-cuts -off-options-in-ie-fix/

Answer 4

这与 PHP 无关。下拉框的长度很可能是通过 CSS 处理的，并且两种浏览器都有自己的限制大小的方法。

Answer 5

这是 IE 中的已知错误/功能（并且有一个 重复的问题）。

在 IE 中，如果设置宽度，IE 会将其视为选择列表和所有选项的确切宽度，无论长度如何。

所有非IE浏览器都会意识到，当选择列表打开时，如果某些option大于指定的select宽度，要加宽（unstylable） 下拉列表以适应，因为 CSS 无法控制它。

由于非 IE 浏览器有一个可用的选择列表，我认为“他们的”版本是正确的。 IE 遵循请求的宽度，但当内容不适合时就不灵活。

在 IE7 或更高版本中，您可以在选项上设置 title="..." 属性，以便为截断的选项提供工具提示（请注意，在 IE6 中这不起作用）

Answer 6

好吧，我有点懒 - 而且乐观 - 但是在 Firefox 和 Chrome 中测试过这一点，尽管只在 Ubuntu 9.10 上，理论 - 至少 - 是声音：

<style type="text/css" media="all">

    select  {
        width: 5em; /* initial width, adjust to taste */
        }

    select:focus,
    select:active
        {
        width: 12em; /* the width of the select box in its focussed/active state */
        }

</style>

说实话，我怀疑它在 IE 上不起作用 - 否则会很容易 - 所以我想要么使用其他地方建议的 title ，或者也许 jQuery/js 来调整select 的宽度与其焦点上最宽/最长的子 option 元素的宽度可能是最好的选择。

编辑以添加上述实时演示的链接： http://davidrhysthomas.co.uk/so/select.html

而且，上帝啊，它也适用于 IE。尽管可能仅在 IE8 上，在 XP SP3 上具有 xhtml 1.0 严格文档类型。