Input HTML di testo da destra a sinistra

Per il mio sito web, ho bisogno di fornire supporto arabo. Parte di esso è di fornire caselle di testo di input in cui quando l’utente digita, i nuovi caratteri devono essere aggiunti a sinistra e il testo deve essere allineato correttamente.

impostando la proprietà css su

text-align:right 

non ha funzionato, in quanto non ho potuto ottenere il cursore di venire a sinistra e aggiungere le lettere lì. Quindi ho rimosso quella proprietà e ho aggiunto

 direction:RTL 

Qui, il cursore si posiziona a sinistra e il testo è allineato a destra. ma i nuovi personaggi aggiunti non venivano aggiunti alla sinistra. Invece venivano aggiunti solo all’estremità destra.

Come posso risolvere questo? per favore aiuto..

Ad esempio, vedi la casella di ricerca della pagina di google arabica. Ho bisogno del comportamento esatto, anche se non con quelle fantasiose icone della tastiera ecc., Http://www.google.com/webhp?hl=ar

Ecco cosa posso pensare:

  • Usa direction:RTL per l’allineamento DESTRA
  • Scrivi un gestore JavaScript collegato all’evento: “onkeyup”, che esegue lo spostamento del carattere inserito a SINISTRA (eseguendo un po ‘di elaborazione del testo).

È ansible utilizzare il dir = “rtl” sull’input. È supportato.

  
 function rtl(element) { if(element.setSelectionRange){ element.setSelectionRange(0,0); } }  

Questo codice farà.

Utilizzare solo la direction:RTL e quando si passa a una tastiera corretta (ad es. In arabo) nelle impostazioni di sistema, i caratteri appena aggiunti verranno aggiunti correttamente a sinistra.

Utilizzare sull’input in css.

 input { unicode-bidi:bidi-override; direction: RTL; } 

Una caratteristica specifica del materiale angular, oltre alla direzione: rtl, è:

 .mat-form-field { text-align: start!important; } 

Questo funzionerà sia per RLT che per LTR