Form e autofocus
Martedì 10 Ottobre 2006 - 09:45
di Cesare Lamanna
Se dovessi fare una petizione, da utente, per promuovere l’adozione di uno script sarebbe per questo sull’autofocus nei form creato da Chris Heilmann.
Il problema nasce su tutti quei siti in cui al caricamento della pagina il focus (e il cursore) è automaticamente impostato su un campo specifico di un form. Se il modulo ha un solo campo di input, no problem, anzi. Ma in altre situazioni la cosa può divenire alquanto fastidiosa. Non immaginate quante volte mi è capitato nell’interfaccia di amministrazione di questo blog. Vado per scrivere o modificare un post, la pagina non è completamente caricata, ed ecco che il maledetto focus, mentre sono nella textarea del post e digito, si sposta automaticamente nel campo del titolo, che irrimediabilmente viene fatto fuori. Potrei fare anche l’esempio di un sito come Expedia.it, citando gli scherzetti che ti combina con quel focus impostato automaticamente sull’opzione “Volo + Hotel”.
Comunque, bando alle lamentele. Un’alternativa ora c’è.
Categoria: Scripting | Permalink
Commenti
1
Prima di leggerlo pensavo fosse il solito modo per attivare gli script prima di “onload”, invece è una soluzione veramente geniale! Grazie!
2
Per non parlare di Firefox quando apre la sua pagina predefinita con l’autofocus settato sul campo di ricerca, quando sto scrivendo sulla barra degli indirizzi www.html.it :P
# - postato da Dart89 - 10 Ottobre 2006 - 11:49
3
Semplice ma utile.
4
se si vuole forzare un focus non capisco perchè aspettare l’onload … questo è uno di quei casi dove una funzione come questa potrebbe essere molto più utile o portabile, imho.
function focusForm(id){ (function(){ var form = document.getElementById(id); if(!document.body || !form) setTimeout(arguments.callee, 1); else { for(var i = 0, focus = false, inputs = form.getElementsByTagName("INPUT"); i < inputs.length && !focus; i ) { if( inputs[i].type.toLowerCase() == "text" && inputs[i].value != inputs[i].defaultValue ) focus = true; }; if(!focus && inputs[0]) inputs[0].focus(); } })(); }; focusForm("myform");Si passa l’id della form e il primo campo che trova lo mette in focus se nessun’altro è già stato cambiato.
5
bene … ultimo tentativo poi rinuncio …
function focusForm(id){ (function(){ var form = document.getElementById(id); if(!document.body || !form) setTimeout(arguments.callee, 1); else { for(var i = 0, focus = false, inputs = form.getElementsByTagName("INPUT"); i < inputs.length && !focus; i ) { if( inputs[i].type.toLowerCase() == "text" && inputs[i].value != inputs[i].defaultValue ) focus = true; }; if(!focus && inputs[0]) inputs[0].focus(); } })(); }; focusForm("myform");
6
… faccio prima così :E
7
Eseguire del codice a quella velocità (frequenza di un millesimo di secondo) serve solo ad inchiodare il browser durante il caricamento… O sbaglio?
8
… O sbaglio?
sbagli perchè il timeout è su una sola operazione … ma se avete paura che una sola funzione nativa javascript possa inchiodare il browser mettete pure timeout più alto …
9
P.S. … giutso per dire che se il codice non fa molto non c’è da preoccuparsi, bytefx fa intervalli da 1 … e gira pure sui vecchi Celeroni …
Inoltre in JS gli intervalli non sono modali, quindi se qualcos’altro fa operazioni “pazzesche” l’intervallo “aspetta” o va a rilento ma non blocca niente :)