cambiar la dirección del texto del cuadro de texto automáticamente

Question

Cuando va a Facebook y quiere dejar un comentario, con respecto al idioma que ha elegido para su teclado, la dirección del cuadro de texto cambia automáticamente al hacer clic para escribir su comentario. Si ha elegido el idioma árabe para su teclado, el cuadro de texto obtiene automáticamente la dirección RTL. alguna idea de cómo se ha implementado? Me gustaría usarlo en mi aplicación web.

Answer 1

Puede utilizar la propiedad CSS direction para lograrlo:

input{ 
    direction: rtl; 
} 

actualización

Para cambiar la dirección del texto dinámicamente en función de la entrada del usuario puede comprobar el primer carácter de la entrada para ver si cumple un criterio dado, en este caso una expresión regular.

$('input').keyup(function(){ 
    $this = $(this); 
    if($this.val().length == 1) 
    { 
     var x = new RegExp("[\x00-\x80]+"); // is ascii 

     //alert(x.test($this.val())); 

     var isAscii = x.test($this.val()); 

     if(isAscii) 
     { 
      $this.css("direction", "ltr"); 
     } 
     else 
     { 
      $this.css("direction", "rtl"); 
     } 
    } 

}); 

Este es un ejemplo básico que utiliza ltr dirección de texto ASCII y rtl para todo lo demás.

Here's a working example.

Answer 2

En HTML5 puede simplemente hacer esto:

<input type="text" dir="auto" /> 

este cambiará automáticamente la dirección de la base de entrada en el primer carácter. Espero que ayude.

NOTA:

Editado: La gente dice que no funciona en IE11.

Answer 3

es mejor detectar la dirección del texto en función del primer carácter del texto. si el primero pertenece al lenguaje RTL, entonces la dirección tiene que cambiar.

ejemplo, un texto en persa con la palabra en inglés en él.

به معنای واقعی cansado هستم

otro ejemplo, un párrafo Inglés podría contener una palabra persa, pero todo el texto tiene que estar en LTR.

esta palabra se utiliza en diferentes situaciones. el significado de شیر es ...

esta función comprobará el primer carácter escrito. Si pertenece a un lenguaje RTL, la dirección cambiará. Este código es compatible con todos los idiomas RTL.

function isRTL(str) { 
    var letters = []; 
    allRTL = new RegExp(
    "^[\u0590-\u05fe\u0600-۾܀-ݎݐ-ݾހ-\u07be߀-\u07fe\u0800-\u083e\u0840-\u085e\u08a0-\u08fe\u0900-ॾ]|\ud802[\udf60-\udf7e]+$" 
); 
    var cursor = 1; 
    for (var i = 0; i <= cursor; i++) { 
    letters[i] = str.substring(i - 1, i); 
    if(/\s/.test(letters[i])) { 
     cursor++; 
    } 
    if (allRTL.test(letters[i])) { 
     return true; 
    } 
    } 
    return false; 
} 
var dir = $("input[type=text]"); 
dir.keyup(function(e) { 
    if (isRTL(dir.val())) { 
    $(this).css("direction", "rtl"); 
    } else { 
    $(this).css("direction", "ltr"); 
    } 
}); 

para obtener más información visite este codepen.