插入英文字符，讓希臘字符回來（javascript）

Question

我有一個任務來製作一個表單，當某人用英文字符輸入時，通過JavaScript的表單輸入元素將自動將字符轉換爲希臘字符輸入元素。按下提交按鈕之前。所以，我做了一個html測試文件，但我不知道我是否正確地做了這件事。

這個想法是，在關鍵時刻，我們得到英文字符，然後從對象中獲得希臘字符，然後我們將它們返回到輸入element(#fname)。

這是到目前爲止我的JavaScript代碼：

var myObject; 

    myObject = { 


     "a" : "α", 
     "b" : "β", 
     "c" : "ψ", 
     "d" : "δ", 
     "e" : "ε", 
     "f" : "φ", 
     "g" : "γ", 
     "h" : "η", 
     "i" : "ι", 
     "j" : "ξ", 
     "k" : "κ", 
     "l" : "λ", 
     "m" : "μ", 
     "n" : "ν", 
     "o" : "ο", 
     "p" : "π", 
     "q" : ";", 
     "r" : "ρ", 
     "s" : "σ", 
     "t" : "τ", 
     "u" : "θ", 
     "v" : "ω", 
     "w" : "ς", 
     "x" : "χ", 
     "y" : "υ", 
     "z" : "ζ", 
     ";" : "" 
    }; 



     var ch = document.getElementById("fname"); //gets the value from the input 
     var chVal = ch.value.split(""); //returns an array 
     //console.log(chVal); 


    function toGreek(chVal,myObject){ 

    var grArray = []; 

    for(var i=0; i<chVal.length; i++){ 
     for(var prop in myObject){ 
      if (myObject.hasOwnProperty(property)) { 

      if(chVal[i]== myObject[prop]) 

       grArray.push(myObject.prop); 

       return grArray; 

      } 
     } 
    } 

    } 

Answer 1

沒有那麼複雜只是改變字符：

function enToGreek(val) { 
    for (var en in myObject) { 
     if (val === en) return myObject[en]; 
    } 
    return val; 
} 

document.getElementById('fname').onkeyup = function(e) { 
    var caretStart = this.selectionStart, 
     caretEnd = this.selectionEnd, 
     en = String.fromCharCode(e.keyCode).toLowerCase(), 
     greek = enToGreek(en); 
    if (en !== greek) { 
     this.value = this.value.replace(en, greek); 
     this.setSelectionRange(caretStart, caretEnd); 
    }  
}; 

演示 - >http://jsfiddle.net/a73Lpq7b/

[更新，現在保存插入位置]

Answer 2

這裏，這應該工作：

function toGreek(input){ 
    var greekObject = { 
    "a" : "α", 
    "b" : "β", 
    "c" : "ψ", 
    "d" : "δ", 
    "e" : "ε", 
    "f" : "φ", 
    "g" : "γ", 
    "h" : "η", 
    "i" : "ι", 
    "j" : "ξ", 
    "k" : "κ", 
    "l" : "λ", 
    "m" : "μ", 
    "n" : "ν", 
    "o" : "ο", 
    "p" : "π", 
    "q" : ";", 
    "r" : "ρ", 
    "s" : "σ", 
    "t" : "τ", 
    "u" : "θ", 
    "v" : "ω", 
    "w" : "ς", 
    "x" : "χ", 
    "y" : "υ", 
    "z" : "ζ", 
    ";" : "" //In OP's Question 
    }; 
    var newStr = ''; 
    for (var substr in input){ 
     newStr += (greekObject.hasOwnProperty(input[substr])) ? greekObject[input[substr]] : ''; 
    } 
    alert(newStr); 
} 

toGreek('abcdef1234'); //Returns αβψδεφ 

Answer 3

我不能肯定這是否是你的問題，但我認爲return grArray;導致函數返回太早，即。即在循環結束之前。這可以通過降低代碼的複雜性來消除。

此函數循環只有一次：

function toGreek(chVal,myObject){ 
    var greekVal=[]; 
    for(var i=0;i<chVal.length;i++){ 
    greekVal[i]=myObject[chVal[i]]||chVal[i]; 
    } 
    return greekVal.join(''); 
} 

的||運營商提供了使用英文字母，而不是在希臘字母的對象沒有找到字符替代。

---

另外，使用ES6：

function toGreek(chVal,myObject){ 
    return [].slice.call(chVal).map(a=>myObject[a]||a).join(''); 
} 

Answer 4

我創建了一個的jsfiddle這你想要做什麼（如果我理解正確的）。

http://jsfiddle.net/aerh38xq/1

你首先需要一個事件偵聽器附加到輸入對象。我這裏包括檢查，以確保只有合法的字符將被轉換，而當前光標所在位置將得到保存：

var ch = document.getElementById("fname"); 
ch.addEventListener('keyup', function(e){ 
    // Only alter on keycode that's in the greek array [a-z] or ';' 
    if (e.keyCode >= 65 && e.keyCode <= 90 || e.keyCode === 190) { 
    // Store selection and get new text 
    var start = ch.selectionStart, 
     end = ch.selectionEnd, 
     output = toGreek(ch.value); 

    // Alter current value 
    ch.value = output; 

    // Restore selector position 
    ch.setSelectionRange(start, end); 
    } 
}); 

的toGreek - 函數會將所有字符無論是從greekArray或價值是什麼是當前的輸入。

var i, 
    len, 
    result = []; 
for (i = 0, len = input.length; i < len; i+= 1) { 
    result[i] = greekArray[input[i]] || input[i]; 
} 
return result.join(''); 

greekArray是所有希臘字符的對象。