在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/