Question

我今天在Firefox for Android（三星Galaxy Tab S2; Android 6.0.1）中遇到了一些非常意外的事情。 HTML <select>元素没有下降，而是显示了覆盖样式的弹出窗口。简单的例子：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
  select {
    height: 3.0em;
    width:15.0em;
  }
  </style>
</head>
<body>
  <select name="dookie" id="dookie">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
  </select>
</body>
</html>

在Firefox for Android（50.1.0）中：

点击下拉列表会产生以下结果：

Chrome for Android和Android浏览器都会按预期显示下拉列表。在Chrome for Android（55.0.2883.91）中：

我在Firefox设置中看不到任何改变此行为的内容。任何人都知道为什么/如何解决这个问题？

Answer 1

这是android firefox显示select标记的方式。没有办法“修复”这个，因为它是一个操作系统行为。

您可以更改它并确保select元素在所有浏览器中的行为完全相同的唯一方法是使用javascript将原始<select>标记替换为基本html元素（比如div / ul / li）和css（所有常规选择库都有（select2，jquery-ui's selectmenu和其他）。

Firefox for Android Select Element不会下拉

1 个答案: