如何防止Web應用基於瀏覽器的音譯與鍵盤事件發生錯誤?

音譯是使用英文鍵盤輸入非英文字符的一種流行方法,實現此目的的典型方法是通過鍵盤事件捕獲,但是移動瀏覽器沒有統一的支持,我們開發使用音譯的Web應用程序時是如何消除基於瀏覽器的音譯與鍵盤事件發生錯誤?

以下為了方便說明實例問題,我們都是使用單個詞英文作為首先,因為我們中文操作有點複雜。

Google的多語言輸入法是使用音譯輸入非英語字符,基本思想是擁有一個文本框,用戶可以在其中使用英文字符拼寫自己語言的單詞。他們通常使用英文鍵盤輸入這些單詞,該Web應用程序將鍵入的英語擊鍵轉換為其本地(非英語)語言的字符,並在文本框中實時顯示這些非英語字符,用戶可以從文本框中複製文本並將其粘貼到另一個網頁或應用程序上的任何文本字段或搜索欄中。

比如我們用Google的多語言輸入法輸入僧伽羅語單詞“පහන”,在中文中意為“燈”,英文為“lamp”。Google輸入工具指定的映射是“ pa”代表“ප”,“ ha”代表“හ”,“ na”代表“න”。

因此,只需在Google輸入工具文本框中輸入 “ pahana”,然後點擊即可enter鍵,映射的僧伽羅語字符“පහන”將出現在文本框中。

如何防止Web應用基於瀏覽器的音譯與鍵盤事件發生錯誤?


它在桌面瀏覽器上可以完美運行,但在Android上運行的Chrome移動瀏覽器上無法運行。

因此我們必須要解決在移動端不能映射的問題:

兩種可以的方法

擊鍵轉換可以使用JavaScript輕鬆實現,如果還涉及單詞預測,那麼就需要後端數據處理,比如PHP、Java、Python等編程語言,但是基本功能可以使用JavaScript實現。

我們可以將非英語(僧伽羅語)字符“ප”映射到英語字符“ p”或鍵盤上的鍵“ p”。

  1. 方法1(典型方法):防止默認行為和捕獲鍵盤事件使用方法1中的JavaScript可以實現兩個主要步驟,首先,必須停止按下或按住鍵時的默認行為。然後,必須在KeyPress,KeyDown或KeyUp事件捕獲功能中指定要鍵入的所需字符。按下或按住某個鍵時的默認行為是在鍵盤上鍵入與該鍵關聯的字符。例如,當按下鍵“ p”時,默認情況下將在文本框中鍵入英文字符“ p”,我們可以防止這種默認行為,並用我們選擇的非英語字符替換任何鍵的默認字符。在我們的示例中,當按下鍵“ p”時,我們將防止鍵入“ p”,並以編程方式插入映射的字符“ප”而不是字符“ p”,我們可以對鍵盤上所有映射的字符執行此操作。
  2. 方法2(新方法):偵聽文本框輸入並根據最新輸入實時修改內容在此方法中,我們不處理任何鍵盤事件,相反,我們將跟蹤文本框中的最新輸入字符,並將該字符替換為我們選擇的非英語字符。在後臺,我們的腳本必須正在偵聽文本框內容的更改。當按下鍵“ p”時,鍵入“ p”。當腳本檢測到最後鍵入的字符是“ p”時,它必須以編程方式刪除鍵入的“ p”並將其替換為“ප”。以類似的方式,可以通過適當的映射將任何非英語字符分配給英語字符來鍵入它們。每當通過按鍵盤上的鍵來鍵入英文字符時,我們要做的就是以編程方式刪除該鍵入的字符,並將其替換為映射中指定的非英文字符。

以上是常用的兩種方式,或許在開發多語言版本時可以使用到。



分享到:


相關文章: