Vorrei verificare se un browser mostrerà uno speciale dropdown in stile "nativo" (come l'iPhone e l'iPod) senza verificare specificamente il nome del browser. È possibile verificare tale capacità in un modo più generico senza guardare l'agente utente per nome?Come rilevare se il browser mobile mostrerà un controllo a discesa "nativo"?
Mi piacerebbe farlo per determinare se eseguire il rendering di un controllo a discesa standard o più avanzato.
Come ho letto questa domanda ho avuto un'idea per una soluzione sporca. Solo un'ipotesi, ma forse aiuta:
Inserisci il tuo elemento nativo nell'HTML e prova a farlo in JavaScript con la funzione elementFromPoint. (MDN link)
Se non si ottiene alcun elemento o l'elemento restituito non è il nativo, si sa che non viene visualizzato.
Non credo che questo sia effettivamente possibile senza una soluzione davvero scarsa. Scommetto che il modo migliore per farlo è rilevare il dispositivo perché praticamente tutti i browser mobili utilizzano un ddl nativo per la visualizzazione delle opzioni.
questo può essere realizzato utilizzando dei media query 's Modernizr e rilevamento del tocco:
if (Modernizr.touch && Modernizr.mq('only screen and (max-width: 768px)') {
//it is a mobile/tablet device
}
o utilizzare regolari media query CSS.
Attualmente sto verificando l'esistenza di window.orientation e sembra che faccia il lavoro per Android e iOS.
rapido e sporco ma fa il lavoro se non si desidera aggiungere una dipendenza su Modernizr – baxeico
È possibile controllare la proprietà aspetto css
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
e se non è 'none' allora il tuo ingresso ha uno stile nativo.
È possibile trovare i valori possibili di aspetto qui: https://developer.mozilla.org/en-US/docs/Web/CSS/-moz-appearance e qui http://trentwalton.com/2010/07/14/css-webkit-appearance/
Sono il 90% sicuro di questa risposta: No.
Si sta cercando di rilevare se siete su un browser che sembra weird ma si sta definendo soggettivamente . La risposta dell'utente Reda è corretta, ma viola una parte della tua domanda (non identificare i browser per nome). Il mio punto è che devi identificare i browser per nome perché il qualificatore è soggettivo, quindi non troverai un test JS/CSS per questo.
I browser hanno il controllo completo su quale menu a discesa mostrano. La maggior parte sono incoerenti con la loro implementazione di CSS su questi componenti dropdown. Non ci sono standard che dicano che un browser deve esporre qualsiasi informazione sul menu a discesa a livello di applicazione.
Per influire su ciò che si desidera, è necessario trovare i browser di cui non è possibile selezionare i controlli a discesa e elencarli e selezionarli tramite Modernizr o altri trucchi del genere. Sfortunatamente questo viola l'intento della tua domanda, quindi penso che la risposta alla tua domanda sia ... no, mi dispiace.
Ti riferisci a come i browser per dispositivi mobili selezionano l'input-input HTML? Qual è la tua definizione di "speciale" qui? –
Ah sì ,. Come l'iPhone seleziona il controllo di input. Fondamentalmente mi chiedo se c'è un modo per rilevare se un browser non rende la selezione in linea e apre il proprio controllo speciale. Grazie. – Jason
Hai trovato una soluzione a questo? Forse guardando 'window.orientation'? Forse tutti quei dispositivi mobili al giorno d'oggi mostrano un controllo nativo (multiplo o non) selezionabile e utilizzabile? – cherouvim