如何为文本区制作自动字符功能

how to make auto character feature for the textarea

本文关键字:字符 功能 文本区      更新时间:2023-09-26

在良好的IDE中,当您按下'(单引号)时,另一个会自动添加到其中,所以我试图将其用于文本区域,因此这里是我的代码,它不工作::

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)是工作,它是日志多少次我按下键在文本区域和工作但只有一次,如果我打开页面包含所有这些代码在浏览器(我使用谷歌Chrome,最新的),当第一次当且仅当我按下键切换实例中列出的代码之后工作但不是功能每次然而console.log(e)功能。

Textarea元素没有HTML内容,所以innerHTML不会做您所期望的。你应该使用value属性:

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);
}
<textarea id="main"></textarea>