select - MaterializeCSS - 为 IOS 和 Android 选择原生

Question

是否可以为 IOS 和 Android 制作所有选择下拉菜单？

因为目前在 IOS 13 下使用 materializecss 的选择不能正常工作。

亲切地

Answer 1

1.使用.browser-default

您可以添加类 browser-default 以获取浏览器默认值。

https://materializecss.com/select.html

<select class="browser-default">
     <option value="" disabled="" selected="">Choose your option</option>
     <option value="1">Option 1</option>
     <option value="2">Option 2</option>
     <option value="3">Option 3</option>
</select>

2.有一个临时的解决方法

在 materialize.js 之后提供以下修补的 select.js 文件适用于大多数用户。

https://github.com/Dogfalo/materialize/blob/v1-dev/js/select.js

Answer 2

解决方案在这里

$(document).click(function(){
    $('li[id^="select-options"]').on('touchend', function (e) {
        e.stopPropagation();
    });
});

Answer 3

该问题是由下拉容器的变换动画引起的。

我创建了一个包来修复这个和其他常见的 materialize-css 问题materialize-css-helper。包中的修复与@gepex建议的类似，但还添加了passive侦听器选项以不降低滚动性能。

您也可以尝试从下拉容器中删除动画：

.dropdown-content {
    transform: none !important;
}