材质选择在iOS上闪烁

Question

我正在尝试在Material Design中创建我的网站,但无论我是使用MDB(Material Design for Bootstrap)还是Materialize CSS框架,我都发现了Material Select的一个问题.两者在Windows/OSX/Android上运行良好,但出于某种原因,当我在iPad上打开Material Select组件并单击它时,有一个闪烁的光标显示在Dropdown的背景中.

Answer 1

我在 iOS 设备上遇到了同样的问题，我正在使用materialisecss“ http://materializecss.com/forms.html中的选择下拉菜单 ”中的选择下拉菜单。为了解决闪烁的光标问题，我使用了下面链接中的参考代码并稍微修改了该代码。

参考链接： https: //github.com/Dogfalo/materialize/issues/901（查看“chi-bd 于 2015 年 11 月 17 日评论”的评论）

jQuery('select').material_select();
/*--- Materialize Select dropdown blinking cursor fix for iOS devices ---*/
jQuery('select').siblings('input.select-dropdown').on('mousedown', function(e) {
    if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
        if (e.clientX >= e.target.clientWidth || e.clientY >= e.target.clientHeight) {
            e.preventDefault();
        }
    }
});

jQuery('选择').material_select(); 初始化物化选择和其余代码是修复。

唯一的问题是这在桌面视图上出现问题，因此添加了移动检测条件

if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {

笔记：在文档就绪中添加此代码 $(document).ready(function() { ... });

就是这样。我希望这能解决您的问题。问候，祝你有美好的一天:)