MaterializeCSS - Select IOS & Android 原生

Question

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

因为目前 IOS 13 下的 selection 与 materializecss 不能正常工作。

亲切

Answer 1

1。使用 .browser-default

You can add the class browser-default to get the browser default.

<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

解决方案here

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

Answer 3

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

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

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

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

MaterializeCSS - Select IOS & Android 原生

MaterializeCSS - Select native for IOS & Android

select

materialize

fireworks

1。使用 .browser-default

2。有一个临时解决方法