Po przejściu do serwisu Facebook i pozostawieniu komentarza, w odniesieniu do wybranego języka dla klawiatury, kierunek pola tekstowego zmienia się automatycznie po kliknięciu w niego w celu napisania komentarza. Jeśli wybrałeś język arabski dla swojej klawiatury, pole tekstowe automatycznie otrzyma kierunek RTL. jakikolwiek pomysł, w jaki sposób został wdrożony? Chciałbym go użyć w mojej aplikacji internetowej.automatycznie zmienia kierunek tekstu w polu tekstowym
Odpowiedz
Można użyć właściwości CSS direction
do osiągnięcia tego celu:
input{
direction: rtl;
}
Aktualizacja
Aby zmienić kierunek tekstu dynamicznie w oparciu o dane wprowadzone przez użytkownika można sprawdzić pierwszy znak wejścia aby sprawdzić, czy spełnia on określone kryteria, w tym przypadku wyrażenie regularne.
$('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");
}
}
});
Jest to prosty przykład, który używa ltr
kierunek tekstu ASCII i rtl
do wszystkiego innego.
Dziękuję, Tak, wiem, ale kierunek będzie rtl zawsze. to, czego chcę, to kiedy piszesz pierwszy znak, jeśli jest to angielski znak, to wejście dostaje kierunek lrt, a jeśli piszesz arabski lub hebrajski, zmienia się automatycznie na rtl. – user217648
dzięki.ale nie działa we wszystkich językach wymiany na klawiaturze –
To rozwiązanie jest bardzo dobre. +1 ...! Jut ma mały problem. Kiedy naciskam '
w HTML5 można po prostu to zrobić:
<input type="text" dir="auto" />
to automatycznie zmieni kierunek podstawy wejściowego na pierwszy znak. Mam nadzieję, że to pomaga.
UWAGA:
Zmieniano: Ludzie mówią, że to nie działa w IE11.
najlepiej wykrywać kierunek tekstu na podstawie pierwszego znaku tekstu. jeśli pierwszy należy do języka RTL, kierunek musi się zmienić.
przykład, perski tekst z angielskim wyrazem w nim.
به معنای واقعی zmęczony هستم
innym przykładzie, ustęp angielski może zawierać perskiego słowa, ale cały tekst musi być w LTR.
to słowo jest używane w różnych sytuacjach. znaczenie شیر to ...
ta funkcja sprawdzi pierwszy wpisany znak. jeśli należy do języka RTL, kierunek zmieni się. Ten kod obsługuje wszystkie języki 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");
}
});
, aby uzyskać więcej informacji, odwiedź ten codepen.
- 1. Jak wyłączyć zawijanie tekstu w polu tekstowym?
- 2. Zmiana koloru tekstu w polu tekstowym
- 3. Zaznaczanie tekstu w polu tekstowym UIAlertController
- 4. UI Test usuwania tekstu w polu tekstowym
- 5. Przeglądarka systemu Android automatycznie zmienia rozmiar tekstu
- 6. Błąd w polu tekstowym
- 7. Ustawianie tekstu podpowiedzi w polu tekstowym w Ruby on Rails
- 8. Zmiana tekstu w polu tekstowym w slajdzie programu Powerpoint
- 9. Wyświetlanie numeru wiersza w polu tekstowym C#
- 10. Zmiana koloru początkowego i tylnego tekstu w polu tekstowym
- 11. Jak ciągle przewijać do końca tekstu w wieloliniowym polu tekstowym?
- 12. Wyśrodkowanie symbolu zastępczego i tekstu wejściowego w polu tekstowym
- 13. Czy mogę pokolorować różne części tekstu w polu tekstowym WPF?
- 14. Jak ustawić kursor na końcu tekstu w zamaskowanym polu tekstowym?
- 15. Wyświetlanie obrazu w polu tekstowym
- 16. Odznacz tekst w polu tekstowym
- 17. CSS Centrum polu tekstowym
- 18. Znaki ignorowane podczas pisania w polu tekstowym
- 19. jak pogrubić określone słowo w polu tekstowym?
- 20. Zmuszanie kierunek tekstu dla LeadingMarginSpan2
- 21. Format DataTime w polu tekstowym w szynach
- 22. Wyłącz autouzupełnianie w polu tekstowym w Django?
- 23. Walidacja w polu tekstowym w WPF
- 24. Zezwalaj tylko na wpis numeryczny w polu tekstowym WPF
- 25. Jak zaktualizować wartość w jednym polu tekstowym na podstawie wartości wprowadzonej w innym polu tekstowym?
- 26. Jak zmienić kolor czcionki w polu tekstowym w języku C#?
- 27. Zapobieganie migotaniu kursora w polu tekstowym
- 28. jQuery: Przechwytywanie klawisza TAB w polu tekstowym
- 29. Wykryj pole UISearchBar w polu tekstowym
- 30. jak wyświetlić wersję publiczną w polu tekstowym?
Zobacz odpowiedź - http://stackoverflow.com/a/14824756/104380 – vsync