更改文本对齐方式 更改语言后

Change Text Align After Change Language

本文关键字：语言 对齐 文本 方式      更新时间：2023-09-26

我在HTML中有一个这样的文本区域：

<textarea name="tx1" style="direction:ltr;"></textarea>

现在，我想在用户将语言更改为阿拉伯语时更改输入文本的方向或对齐它们。任何问题或任何按钮或任何提交我想知道他打字时的用户语言。如果用户是阿拉伯语，请将文本区域对齐设置为右对齐。如果英语将其设置为左。

您只能通过 CSS 来完成：

textarea{
   text-align: start;
   unicode-bidi: plaintext;
}

演示

此解决方案适用于Chrome和FF，但不适用于Microsoft Edge。

我能想到的唯一方法是检查文本区域的值

var arabicPattern = /['u0600-'u06FF]/;
$('#text').bind('input propertychange', function(ev) {
    var text = ev.target.value;
    if (arabicPattern.test(text)) {
        // arabic;
        $('#text').css('direction', 'rtl')
    }

});

但是仅检查阿拉伯语是不够的。您必须检查每个 rtl 脚本

工作示例

如果您不告诉我们如何更改用户的语言，我们将无法提供帮助。我想你将不得不使用超文本预处理器（如PHP）或复制两种语言的页面。

如果你对我告诉你的内容一无所知，我会调整它，以便你能够使用jQuery。但是，如果您不进行任何其他此类预处理，则这不是一个好的做法。

var isArabic = false;
if (isArabic) {
    $("textarea").css("direction", "rtl");
}

如果您使用 PHP，则可以将用户语言存储在会话数组中，并且每当用户更改语言时，更改变量，以便预处理 HTML，使其显示 RTL。

编辑

我只是明白你想问什么。

明白了：

var language;
$('#element').keypress(function() {
    language = window.navigator.userLanguage || window.navigator.language;
    if (language=="language_code_using_LTR") {
        $(this).css("direction", "rtl");
    }
});
在"

更改语言"下拉列表中，如果下拉列表中的选定值显示阿拉伯语，则将类添加到正文，然后根据该类写入样式。

更改元素的所有属性将导致性能问题，并且不建议干杯。

示例如下：

body.direction_rtl textarea
{
direction:ltr;
}

"direction_rtl"您正在从脚本添加类

提及所有需要从右到左对齐的元素

相关文章：