如何为textarea制作自动角色功能

时间:2015-10-26 07:17:38

标签: javascript textarea

在好的IDE中,当你按下'(单引号)然后另一个被自动添加到它时很常见,所以我试图为textarea创建它,所以这里是我的代码,它不起作用: :

var ele = document.getElementById('main');
ele.onkeypress = function(e){
  switch(e.keyCode){
      case 59: ele.innerHTML+=";"; break;
      case 39: ele.innerHTML+="'"; break;
      case 47: ele.innerHTML+='/'; break;
      case 91: ele.innerHTML+=']'; break;
      case 123: ele.innerHTML+='}'; break;
      case 45: ele.innerHTML+='-'; break;
  }
    console.log(e);
}

HTML

<textarea id="main"></textarea>

console.log(e)正在工作,它正在多次登录我在textarea中按键并且它正在工作但是只有一次,如果我在浏览器中打开包含所有这些代码的页面(我正在使用谷歌浏览器,最新)和第一次,当且仅当我按下其代码列在交换机案例中的密钥然后它可以工作但之后它不起作用,但console.log(e)每次都在运行。

1 个答案:

答案 0 :(得分:1)

Textarea元素没有HTML内容,因此innerHTML不会做您期望的事情。您应该使用value属性:

&#13;
&#13;
var ele = document.getElementById('main');
ele.onkeypress = function(e){
  switch(e.keyCode){
      case 59: ele.value += ";"; break;
      case 39: ele.value += "'"; break;
      case 47: ele.value += '/'; break;
      case 93: ele.value += ']'; break;
      case 125: ele.value += '}'; break;
      case 45: ele.value += '-'; break;
  }
  console.log(e.keyCode);
}
&#13;
<textarea id="main"></textarea>
&#13;
&#13;
&#13;