Javascript 支持RTL语言

我想让我的网站同时支持LTR和RTL语言

我想要的是，如果某个元素中加载的文本是RTL，那么将方向切换到RTL。同样对于输入，当用户键入文本时，如果是RTL，则应该触发，并将方向更改为RTL

比如说Facebook就是这样做的。如果您在搜索中键入一些阿拉伯语文本，它将自动将方向切换到RTL

没有通过谷歌搜索找到任何练习教程，任何脚本等等

我只找到了属性

dir=“auto”

，它会自动触发正确的方向，但看起来像这样，旧浏览器不支持它

---

任何关于如何做到这一点的建议、教程和脚本都会有所帮助

如果您只想在用户键入时支持将文本框上下文从LTR切换到RTL，那么您必须听输入事件（input、keypress、keydown等，以最适合您的情况为准），并让代码决定文本框是LTR对齐还是RTL对齐

不过，您应该注意，这方面的算法并不那么简单，不同的产品工作方式也不同。几个例子-

• Facebook使用的一种算法在很大程度上是试图识别第一个“强”字符，因此，在一个句子中键入一个希伯来语单词，后跟大量英语，仍然会显示该段落是RTL对齐的。（你打字时看到的内容和发表评论时看到的内容似乎也有所不同，但这是另一个问题）
• Google hangouts似乎根据每个方向上强字符的数量来切换其RTL/LTR上下文。当您键入时，如果您开始键入一种语言而不是另一种语言，您的上下文可能会多次从LTR切换到RTL

这里没有对错之分，只有偏好和最适合您的算法

您可以在此处阅读Unicode双向算法中的“强字符”：

您可以看到一个示例，说明如何识别字符串中的第一个“强字符”以嵌入MediaWiki的语言文件中，使用测试方向性的正则表达式（组1为LTR，组2为RTL），您可以使用它们创建一个JavaScript方法，设置textarea的dir=“”基于第一个强字符或大多数字符的属性，如您所见：

作为旁注，我只想指出，支持RTL/LTR online不仅仅是打字和文本框。在LTR和RTL上下文之间进行更改还涉及UI调整，例如镜像内容的对齐和/或菜单和徽标等内容的位置

---

如果您希望将页面翻译为RTL语言，这与此相关，这意味着您还需要镜像布局。如果您唯一的目标是在文本框中切换上下文，则不必担心这一点，但如果要确保站点允许进行翻译，则需要考虑镜像UI和整个接口的方法。

这样做的方法是在键入（OnKyUp）时检查内容，并基于内容（第一字符或全部字符串）。追踪

dir

属性的值。

dir=“auto”

是html5的一部分（正如您所说，旧浏览器不支持html5）。@Dekel关于您的第一条评论。是的，我认为这是一种选择，但是有没有JS的例子呢。我很惊讶，我找不到任何例子或任何东西。我不太确定自己写这篇文章有什么问题。你已经试过什么了吗？你已经很接近了。有几种方法可以做到这一点。您的是其中之一（但您不需要RTL语言，您需要这些语言的实际字符）。学习一些正则表达式，开始做一些事情，然后你可以得到帮助：）