Vă mulțumim pentru susținere

Capturați cheia TAB în caseta de text

Aș dori să pot utiliza cheia Tab în caseta de text pentru a filă în patru spații. În modul în care este acum, tasta Tab salută cursorul la următoarea intrare.

Există un javascript care va captura cheia Tab în caseta de text înainte de a bulează până la interfața de utilizare?

Înțeleg că unele browsere (adică FireFox) pot să nu permită acest lucru. Ce zici de un combo-cheie combo particularizat, cum ar fi Shift + Tab sau Ctrl + Q ?

0
adăugat editat
Acest post a fost marcat de moderator ca fiind "aparține pe meta.stackoverflow.com", dar are peste doi ani, așa că nu migrez.
adăugat autor Robert Harvey
Nu uitați să verificați fereastra focalizată și lăsați-o să explodeze în mod normal dacă nu sunteți în editorul textarea.
adăugat autor FlySwat

6 răspunsuri

Aș sfătui să nu modificați comportamentul implicit al unei chei. Fac cât mai mult posibil fără să atingeți un mouse, așa că dacă faceți cheia tab-ului să nu treceți la câmpul următor într-un formular, voi fi foarte agravat.

O cheie de comenzi rapide ar putea fi folositoare totuși, mai ales în cazul blocurilor de coduri mari și în cuiburi. Shift-TAB este o opțiune proastă, deoarece în mod normal mă duce la câmpul anterior pe un formular. Poate un nou buton din editorul WMD pentru a introduce un cod-TAB, cu o cheie de comenzi rapide, ar fi posibil?

0
adăugat
@ Carlis foarte bun punct despre implicațiile accesibilității.
adăugat autor Wally Lawless
Întrebarea este complet dependentă de aplicație. Lucrez la un control al editorului de cod. Nu am furnizat o cheie tab și studenții mei s-au plâns. Nu am făcut-o pentru că nu am vrut să-i rup accesibilitatea pentru celălalt elev care era orb. Am adăugat acum suportul filelor, dar a oferit de asemenea o opțiune de preferință a utilizatorului pentru ao dezactiva.
adăugat autor Charles

In Chrome on the Mac, alt-tab inserts a tab character into a

Iată unul:. Wee!

0
adăugat

Răspunsul anterior este bine, dar eu sunt unul dintre acei tipi care se împotrivesc ferm comportamentului de amestecare cu prezentarea (punerea JavaScript în codul meu HTML), așadar prefer să pun logica mea de gestionare a evenimentelor în fișierele mele JavaScript. În plus, nu toate browserele implementează evenimentul (sau e) în același mod. Poate doriți să faceți o verificare înainte de a rula orice logică:

document.onkeydown = TabExample;

function TabExample(evt) {
  var evt = (evt) ? evt : ((event) ? event : null);
  var tabKey = 9;
  if(evt.keyCode == tabKey) {
    // do work
  }
}
0
adăugat

Aș prefera ca indentarea filelor să nu funcționeze decât să rupă tabela între elementele formularului.

Dacă doriți să introduceți codul în caseta Markdown, utilizați Ctrl + K (sau? K pe un Mac).

În ceea ce privește oprirea efectivă a acțiunii, jQuery (care utilizează Stack Overflow) va opri un eveniment de la bubbling atunci când returnați falsul de la un apel invers. Acest lucru face viața mai ușoară pentru lucrul cu mai multe browsere.

0
adăugat

Chiar dacă capturați evenimentul keydown / keyup, acestea sunt singurele evenimente la care se declanșează fila tab, aveți nevoie în continuare de o cale de a preveni apariția acțiunii implicite, trecând la următorul element din ordinea filelor.

În Firefox, puteți apela metoda preventDefault () pe obiectul de eveniment transmis manipulatorului evenimentului. În IE, trebuie să întoarceți fals din mânerul evenimentului. Biblioteca JQuery oferă o metodă preventDefault la obiectul evenimentului care funcționează în IE și FF.

0
adăugat
@SteveFenton Există o modalitate simplă de a elimina spațiile din nou cu keycode 8 ?
adăugat autor yckart
Tocmai am corectat linia 4, de la "if (el.attachEvent)" la "if (myInput.attachEvent)"
adăugat autor Fenton
Observați că acest cod adaugă TAB numai la sfârșit. Este incomod în majoritatea ocaziilor.
adăugat autor Alexander Palamarchuk

există o problemă în cel mai bun răspuns oferit de ScottKoon

aici este

} else if(el.attachEvent ) {
    myInput.attachEvent('onkeydown',this.keyHandler); /* damn IE hack */
}

Ar trebui să fie

} else if(myInput.attachEvent ) {
    myInput.attachEvent('onkeydown',this.keyHandler); /* damn IE hack */
}

Din acest motiv, nu a funcționat în IE. Sperând că ScottKoon va actualiza codul

0
adăugat