Può autocapitalizzare essere disattivato con javascript in mobile safari?

Question

Mobile safari supporta un attributo su elementi di input denominato autocapitalize [documented here], che quando impostato su "off" interromperà l'iPhone inserendo il testo in ingresso in quel campo, utile per i campi url o email.

<input type="text" class="email" autocapitalize="off" /> 

Ma questo attributo non è valido per HTML 5 (o un altro spec per quanto ne so) in modo da includerla nel codice HTML produrrà una pagina html non valido, quello che vorrei fare è essere in grado di aggiungere questo attributo a particolari campi onLoad con javascript con qualcosa di simile:

$(document).ready(function(){ 
    jQuery('input.email, input.url').attr('autocapitalize', 'off'); 
}); 

che aggiunge l'attributo corretto in Firefox e Safari del desktop, ma non sembra fare nulla in Safari mobile, Tutte le idee perché?

Answer 1

Questo dovrebbe essere risolto in iPhone OS 3.0. Quale versione di iPhone OS stai provando?

Email: <input id="email" type="text"><br> 
URL: <input id="url" type="text"><br> 
<script> 
//document.getElementById("email").autocapitalize = 'off'; 
//document.getElementById("url").autocapitalize = 'on'; 
document.getElementById("email").setAttribute('autocapitalize', 'off'); 
document.getElementById("url").setAttribute('autocapitalize', 'on'); 
alert(document.body.innerHTML); 
</script> 

Answer 2

Se si tratta di una funzionalità utile, è sufficiente scegliere tra la convalida rigorosa e l'esperienza utente. Personalmente, sceglierei UX ogni giorno.

Answer 3

Quindi non ho potuto ottenere jQuery per farlo, ma pianura vecchio javascript, come suggerito ddkilzer opere, così ho messo insieme questa funzione per applicare l'autocapitalize = 'off' opzione per tutti gli ingressi con una specifica classe:

$(document).ready(function(){ 
    // disable autocapitalize on .url, .email fields 
    unautocapitalize('url'); 
    unautocapitalize('email'); 
}); 

function unautocapitalize(cssClass){ 
    var elems = document.getElementsByClassName(cssClass); 
    for (var j = 0; j < elems.length; j++){ 
    elems[j].setAttribute('autocapitalize', 'off'); 
    } 
} 

Answer 4

Nota a margine. Puoi migliorare ulteriormente l'esperienza utente su iOS specificando il tipo di input da "email" per far apparire automaticamente la tastiera "email" (caratteri leggermente migliori per digitare un'e-mail).

<input type="email" class="email" autocapitalize="off" /> 

Here is some documentation su come tipi di input possono controllare la tastiera IOS.

Answer 5

Non è valido se lo aggiungi tramite script o se lo aggiungi nel markup. È solo che il validatore non è in grado di notarlo se lo aggiungi tramite script.

Basta inserirlo nel markup e mettere un commento accanto ad esso, come <!-- the "autocapitalize" attribute is an Apple proprietary extension for the iPhone to change its IME behaviour -->, in questo modo le persone che guardano il codice nel validatore sapranno cosa succede.