更改语言后更改文本对齐

时间:2014-12-26 14:16:43

标签: javascript jquery html css

我有一个HTML格式的文本区域:

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

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

4 个答案:

答案 0 :(得分:1)

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

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 scripts

Working example

答案 1 :(得分:1)

您只能通过CSS来做到这一点:

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

Demo

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

答案 2 :(得分:0)

如果您没有告诉我们您如何更改用户的语言,我们无能为力。我想你必须使用超文本预处理器(如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");
    }
});

答案 3 :(得分:0)

在更改语言下拉菜单时,如果下拉列表中的选定值显示阿拉伯语,则添加类到主体然后根据该类写入样式。

更改元素的所有属性将导致性能问题,并且不可建议 欢呼声。

示例如下:

body.direction_rtl textarea
{
direction:ltr;
}

&#34; direction_rtl&#34;你是从脚本

添加类

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