Materiał Wybrać miganie na iOS

Question

Próbuję utworzyć moją stronę w Material Design, jednak znalazłem jeden problem z wyborem materiału niezależnie od tego, czy używam MDB (Material Design for Bootstrap), czy Materialise CSS framework. Oba działają poprawnie na Windows/OSX/Androidzie, jednak z jakiegoś powodu, kiedy otwieram Material Select component na moim iPadzie i klikam na nim, pojawia się migający kursor z tła listy rozwijanej.

Answer 1

Wypróbuj poniższy kod:

input.select-dropdown { 
    -webkit-user-select:none; 
    -moz-user-select:none; 
    -ms-user-select:none; 
    -o-user-select:none; 
    user-select:none; 
} 

Answer 2

miałem ten sam problem na urządzeniach z iOS, używam wybierz rozwijaną od materialisecss "http://materializecss.com/forms.html". naprawić błąd migającego kursora, użyłem kodu odniesienia z poniższego linku i nieznacznie zmodyfikowałem ten kod. .

Ref Link: https://github.com/Dogfalo/materialize/issues/901 (komentarz kontrola przez "chi-BD skomentował w dniu 17 listopada 2015")

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 ('select') material_select(); aby zainicjować zmaterializuj wybierz i kod odpoczynku jest poprawką.

jedynym problemem było to dawał problem na widok pulpitu więc warunek dodana detekcja mobilną

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

Uwaga: Dodaj ten kod w dokumencie gotowe $ (document) .ready (function() {.. .});

to wszystko. Mam nadzieję, że to rozwiąże twój problem. Pozdrawiam i życzę miłego dnia :)

Answer 3

Przepraszam, powyższy kod działa, ale potem przestaje przewijać listę rozwijaną.

Na razie używam poniżej poprawki, ale najpierw pokazuje migający kursor, a następnie ją ukrywa. ale nadal nie jest to idealne rozwiązanie, jeśli ktoś ma lepsze rozwiązanie proszę pisać tutaj :)

function checkDropDown(obj){ 
var nextObj = jQuery(obj).next(); 
setTimeout(function(){  
    if (jQuery(nextObj).is(":visible")){ 
     jQuery("input.select-dropdown").css({ 
      "transition" : "none", 
      "left"   : "-999999px" 
     }); 
    }else{ 
     jQuery("input.select-dropdown").css({ 
      "left"   : 0 
     }); 
    } 
}, 250); 
jQuery(document).ready(function(){ 
    jQuery("input.select-dropdown").on("focus", function(){ 
     checkDropDown(jQuery(this)); 
    }); 
    jQuery("input.select-dropdown").on("blur", function(){ 
     checkDropDown(jQuery(this)); 
    }); 
});