在textarea中實現代碼片段

Question

我試圖在html textarea中實現代碼片段。你寫一個特定的單詞，它會查看關鍵值對象並擴展文本（如果存在）。這是我做了什麼：

var textarea = document.getElementById("whatever"); 
var snippets = { 
    'hello': 'Hello and welcome to my great site' 
} 
var prepend = ""; 

var checkCaps = function(e){ 
    if (e.keyCode != 9) return; 
    e.preventDefault(); 
    var string = ""; 
    var pos = textarea.selectionStart; 
    var text = textarea.value.split(""); 
    while (pos) { 
    char = text.pop(pos); 
    prepend = (char == " ") ? " ": ""; 
    if (char == " ") break; 
    string += char 
    pos -= 1; 
    } 
    if (snippets[string.reverse()]) { 
     textarea.value = text.join("") 
     textarea.value += prepend + snippets[string.reverse()] 
    } 
} 


textarea.addEventListener("keydown", checkCaps, false); 

String.prototype.reverse=function(){return this.split("").reverse().join("");} 

http://jsfiddle.net/JjTmd/

的問題是，該代碼段只適用於文本區域的value的最後一個字，我似乎無法找出問題的所在。

Answer 1

Array.pop不接受參數。它刪除並返回數組中的最後一項。使用splice刪除特定索引處的項目。

我修改你的函數如下，它似乎具有所期望的行爲：

var checkCaps = function(e){ 
    if (e.keyCode != 9) return; 
    e.preventDefault(); 
    var string = ""; 
    var pos = textarea.selectionStart; 
    var text = textarea.value.split(""); 
    while (pos) { 
    char = text.splice(pos-1,1); 
    prepend = (char == " ") ? " ": ""; 
    if (char == " ") break; 
    string += char 
    pos -= 1; 
    } 
    if (snippets[string.reverse()]) { 
     var start = text.splice(0, pos); 
     var end = text.splice(pos + string.length); 

     textarea.value = start.join("") + snippets[string.reverse()] + prepend + text.join("") + end.join(""); 
    } 
} 

http://jsfiddle.net/JjTmd/1/

此外，你可能會想檢查新行字符，以及：

while (pos) { 
    char = text.splice(pos-1,1); 

     if (char == " " || char == "\n") { 
      prepend = char; 
      break; 
     } 
    string += char 
    pos -= 1; 
} 

http://jsfiddle.net/JjTmd/2/