引导下拉列表在Android上不起作用 问题

如果您从桌面浏览器转到并查看左侧，您将看到一个使用引导下拉列表的过滤器/侧栏，您将看到它们工作正常（它们下拉列表）：

如果视图的范围足够窄，一些jQuery会将这些下拉列表移动到辅助顶部导航栏中，但它们仍然可以工作（它们将下拉）：

---

现在，如果您在从Android或iOS（iPhone或iPad）加载页面时尝试这些相同的方法，您将看到下拉菜单不再起作用：

---

HTML 如果您选择，您将只看到较小的CSS差异：

---

如果您愿意，您将看到与上面的diff的唯一真正区别是在每个选择器中添加了一个

mobile

类：

---

我试过的

• 如果您在Chrome Devtools中尝试

  Responsive

  选项，该选项使用Android用户代理字符串，则无论加载页面时页面有多宽，下拉列表都不会工作
• 我已经尝试将服务器配置为为桌面和Android/iOS版本的页面提供相同的HTML，我看到了相同的行为：桌面下拉菜单工作，而Android/iOS下拉菜单不工作
• 我曾尝试使用Chrome Devtools从选择器中删除

  mobile

  类，但似乎没有任何效果（下拉列表仍然没有出现）
• 该网站正在使用Boostrap v3.0.3。如果我用最新的v4.1.3

  bootstrap.js

  文件替换v3.0.3

  bootstrap.js

  文件，它仍然不起作用，但我不确定它是否会起作用，或者CSS类是否已经改变
• 我已经在一个实际的Android设备上尝试了这一点，以确认它确实在发生，而不仅仅是ChromeDevTools的bug
• 我尝试将网站从Bootstrap v3.0.3升级到最新的v3.3.7，但似乎没有效果

---

我猜发生了什么事 在我看来，用户代理字符串被引导程序以某种方式使用，这导致下拉列表无法工作

---

我在网上发现的相关问题

• 我在谷歌上搜索并找到了，但尽管它们似乎有些关联（因为它们涉及到用户代理字符串的bug），但它们似乎并没有解决我的问题
• 此人似乎遇到了同样的问题：
• 当用户单击外部元素时，您的库（或代码）可能会通过编程方式模拟在HTML select上的第二次单击来处理第一次单击
  编程/脚本化的mouseevent被视为“不受信任”，并且不会处理默认事件。又名，选择将不会展开，用户必须再次单击
  如果您使用的库提供了一个完整的小部件（某个元素+一个HTML选择），请尝试将您的库更新到最新版本，以查看它们是否采取了另一种方法（除了以编程方式向HTML选择发送mouseevent）

更新

• 我的一位同事在一台真正的iOS设备上进行了测试，他报告说，下拉菜单工作正常，但在iOS上，用户没有显示一个类似桌面上的下拉窗口：

---

问题似乎是使用（v2.2.3）进行选择的结果，该选择可能使用jQuery来处理单击，而这可能是由于

为了解决这个问题，我让我的Web.py（pythonweb framework）模板文件查看用户代理字符串，如果出现“android”，它会将selects”类设置为“formcontrol”（一个引导类），从而让引导样式显示selects，如果是“android”不在用户代理字符串中，它将像往常一样使用FormStone选择器插件

---

因此，澄清一下：尽管我认为selects使用的是Bootstrap，而Bootstrap不起作用，但事实证明selects没有使用Bootstrap，Bootstrap v3.0.3 selects在Android上起作用。

您已经修复了吗？它对我有效，我正在复制你所做的一切。@TomDickson不，当我使用Chrome Devtools模拟Android/iOS设备时，它对我仍然无效。你尝试过在Chrome中清除缓存吗？您还尝试过其他浏览器吗？@TomDickson我已将Devtools设置为不使用缓存。根据你的建议，我刚刚在Firefox开发者版中试用过，但我仍然看不到下拉列表，因为我的同事告诉我，在iOS上，选择值的显示方式不同（它们出现在手机屏幕底部的iOS特定UI中），我想我可能需要使用一个模拟器来看看使用不同的浏览器是否会有所不同。