Question

我正在开发一个＆＃34; Singlish＆＃34;为我的网站打字部分（一个unicode转换器）。我从互联网上找到了一个完整的代码示例。它有两个文本框。像这样，

＆＃13;

<textarea  onkeyup="startText();" onclick="startText();" style="font-size: 12pt;
width: 600px;" name="box1" rows="7" ></textarea>


<input type="reset" value="Reset" style="position: relative; left: 500px; width: 100px;" />
<br />

<span class="TableText">Unicode (යුනිකෝඩ්)</span><br />

<textarea onkeyup="startText();" onselect="startText();" onclick="startText();" style="font-size: 14pt; font-family: Potha, Malithi Web , Arial Unicode MS;
width: 600px;" name="box2" rows="7"></textarea>


<input onclick="copyit('txtBox.box2')" type="button" value="Copy" style="position: relative;
left: 500px; width: 100px;" />

＆＃13;

当用户绑在第一个文本框中时，第二个文本框显示转换后的僧伽罗字符，但我只需要一秒钟的文本框并在用户输入时转换unicode。所以我删除了第一个文本框并使用了这段代码，

＆＃13;

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html >
<head>
<title>Real Time Unicode Converter</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href="main.css" />
<style type="text/css">
@font-face {
font-family: Potha;
src: url(POTHA0.eot);
}
.english{
color: purple;
}
.sinhala{
font-family: Iskoola Pota;
color: navy;
}
.title{
font-familiy:Arial;
font-weight:bold;
color:navy;
}
.title2{
font-familiy:Arial;
font-weight:bold;
}
.link{
font-weight: bold;
color: green;
border-width: 1px;
border-style:solid;
border-color: green;
cursor:hand;
}
</style>

<script language="JavaScript" type="text/javascript">
<!-- Begin
var text = "";
var nVowels;
    var charStr = "";
var consonants= new Array()
var consonantsUni= new Array()
var vowels= new Array()
var vowelsUni= new Array()
var vowelModifiersUni= new Array()
var specialConsonants= new Array()
var specialConsonantsUni= new Array()
var specialCharUni= new Array()
var specialChar= new Array()


vowelsUni[0]='ඌ'; vowels[0]='oo'; vowelModifiersUni[0]='ූ';
vowelsUni[1]='ඕ'; vowels[1]='o\\)'; vowelModifiersUni[1]='ෝ';
vowelsUni[2]='ඕ'; vowels[2]='oe'; vowelModifiersUni[2]='ෝ';
vowelsUni[3]='ආ'; vowels[3]='aa'; vowelModifiersUni[3]='ා';
vowelsUni[4]='ආ'; vowels[4]='a\\)'; vowelModifiersUni[4]='ා';
vowelsUni[5]='ඈ'; vowels[5]='Aa'; vowelModifiersUni[5]='ෑ';
vowelsUni[6]='ඈ'; vowels[6]='A\\)'; vowelModifiersUni[6]='ෑ';
vowelsUni[7]='ඈ'; vowels[7]='ae'; vowelModifiersUni[7]='ෑ';
vowelsUni[8]='ඊ'; vowels[8]='ii'; vowelModifiersUni[8]='ී';
vowelsUni[9]='ඊ'; vowels[9]='i\\)'; vowelModifiersUni[9]='ී';
vowelsUni[10]='ඊ'; vowels[10]='ie'; vowelModifiersUni[10]='ී';
vowelsUni[11]='ඊ'; vowels[11]='ee'; vowelModifiersUni[11]='ී';
vowelsUni[12]='ඒ'; vowels[12]='ea'; vowelModifiersUni[12]='ේ';
vowelsUni[13]='ඒ'; vowels[13]='e\\)'; vowelModifiersUni[13]='ේ';
vowelsUni[14]='ඒ'; vowels[14]='ei'; vowelModifiersUni[14]='ේ';
vowelsUni[15]='ඌ'; vowels[15]='uu'; vowelModifiersUni[15]='ූ';
vowelsUni[16]='ඌ'; vowels[16]='u\\)'; vowelModifiersUni[16]='ූ';
vowelsUni[17]='ඖ'; vowels[17]='au'; vowelModifiersUni[17]='ෞ';
vowelsUni[18]='ඇ'; vowels[18]='/\a'; vowelModifiersUni[18]='ැ';
vowelsUni[19]='අ'; vowels[19]='a'; vowelModifiersUni[19]='';
vowelsUni[20]='ඇ'; vowels[20]='A'; vowelModifiersUni[20]='ැ';
vowelsUni[21]='ඉ'; vowels[21]='i'; vowelModifiersUni[21]='ි';
vowelsUni[22]='එ'; vowels[22]='e'; vowelModifiersUni[22]='ෙ';
vowelsUni[23]='උ'; vowels[23]='u'; vowelModifiersUni[23]='ු';
vowelsUni[24]='ඔ'; vowels[24]='o'; vowelModifiersUni[24]='ො';
vowelsUni[25]='ඓ'; vowels[25]='I'; vowelModifiersUni[25]='ෛ';
nVowels=26;

specialConsonantsUni[0]='ං'; specialConsonants[0]=/\\n/g;
specialConsonantsUni[1]='ඃ'; specialConsonants[1]=/\\h/g;
specialConsonantsUni[2]='ඞ'; specialConsonants[2]=/\\N/g;
specialConsonantsUni[3]='ඍ'; specialConsonants[3]=/\\R/g;
//special characher Repaya
specialConsonantsUni[4]='ර්'+'\u200D'; specialConsonants[4]=/R/g;
specialConsonantsUni[5]='ර්'+'\u200D'; specialConsonants[5]=/\\r/g;
consonantsUni[0]='ඬ'; consonants[0]='nnd';
consonantsUni[1]='ඳ'; consonants[1]='nndh';
consonantsUni[2]='ඟ'; consonants[2]='nng';
consonantsUni[3]='ථ'; consonants[3]='Th';
consonantsUni[4]='ධ'; consonants[4]='Dh';
consonantsUni[5]='ඝ'; consonants[5]='gh';
consonantsUni[6]='ඡ'; consonants[6]='Ch';
consonantsUni[7]='ඵ'; consonants[7]='ph';
consonantsUni[8]='භ'; consonants[8]='bh';
consonantsUni[9]='ශ'; consonants[9]='sh';
consonantsUni[10]='ෂ'; consonants[10]='Sh';
consonantsUni[11]='ඥ'; consonants[11]='GN';
consonantsUni[12]='ඤ'; consonants[12]='KN';
consonantsUni[13]='ළු'; consonants[13]='Lu';
consonantsUni[14]='ද'; consonants[14]='dh';
consonantsUni[15]='ච'; consonants[15]='ch';
consonantsUni[16]='ඛ'; consonants[16]='kh';
consonantsUni[17]='ත'; consonants[17]='th';
consonantsUni[18]='ට'; consonants[18]='t';
consonantsUni[19]='ක'; consonants[19]='k';
consonantsUni[20]='ඩ'; consonants[20]='d';
consonantsUni[21]='න'; consonants[21]='n';
consonantsUni[22]='ප'; consonants[22]='p';
consonantsUni[23]='බ'; consonants[23]='b';
consonantsUni[24]='ම'; consonants[24]='m';
consonantsUni[25]='‍ය'; consonants[25]='\\u005C' + 'y';
consonantsUni[26]='‍ය'; consonants[26]='Y';
consonantsUni[27]='ය'; consonants[27]='y';
consonantsUni[28]='ජ'; consonants[28]='j';
consonantsUni[29]='ල'; consonants[29]='l';
consonantsUni[30]='ව'; consonants[30]='v';
consonantsUni[31]='ව'; consonants[31]='w';
consonantsUni[32]='ස'; consonants[32]='s';
consonantsUni[33]='හ'; consonants[33]='h';
consonantsUni[34]='ණ'; consonants[34]='N';
consonantsUni[35]='ළ'; consonants[35]='L';
consonantsUni[36]='ඛ'; consonants[36]='K';
consonantsUni[37]='ඝ'; consonants[37]='G';
consonantsUni[38]='ඨ'; consonants[38]='T';
consonantsUni[39]='ඪ'; consonants[39]='D';
consonantsUni[40]='ඵ'; consonants[40]='P';
consonantsUni[41]='ඹ'; consonants[41]='B';
consonantsUni[42]='ෆ'; consonants[42]='f';
consonantsUni[43]='ඣ'; consonants[43]='q';
consonantsUni[44]='ග'; consonants[44]='g';
//last because we need to ommit this in dealing with Rakaransha
consonantsUni[45]='ර'; consonants[45]='r';

specialCharUni[0]='ෲ'; specialChar[0]='ruu';
specialCharUni[1]='ෘ'; specialChar[1]='ru';
//specialCharUni[2]='්‍ර'; specialChar[2]='ra';

function startText() {
var s,r,v;

    document.txtBox.box2.onkeypress = function(evt) {
    evt = evt || window.event;
    var charCode = evt.keyCode || evt.which;
       if(charCode == 8){
           console.log("");
       }
    charStr = charStr + String.fromCharCode(charCode);
    text = charStr;
};
    
// +++++++++ Unicode conversion part starts here  ++++++++++++++++++ 

//special consonents
for (var i=0; i<specialConsonants.length; i++){
text = text.replace(specialConsonants[i], specialConsonantsUni[i]);
}
//consonents + special Chars
for (var i=0; i<specialCharUni.length; i++){
for (var j=0;j<consonants.length;j++){
s = consonants[j] + specialChar[i];
v = consonantsUni[j] + specialCharUni[i];
r = new RegExp(s, "g");
text = text.replace(r, v);
}
}
//consonants + Rakaransha + vowel modifiers
for (var j=0;j<consonants.length;j++){
for (var i=0;i<vowels.length;i++){
s = consonants[j] + "r" + vowels[i];
v = consonantsUni[j] + "්‍ර" + vowelModifiersUni[i];
r = new RegExp(s, "g");
text = text.replace(r, v);
}
s = consonants[j] + "r";
v = consonantsUni[j] + "්‍ර";
r = new RegExp(s, "g");
text = text.replace(r, v);
}
//consonents + vowel modifiers
for (var i=0;i<consonants.length;i++){
for (var j=0;j<nVowels;j++){
s = consonants[i]+vowels[j];
v = consonantsUni[i] + vowelModifiersUni[j];
r = new RegExp(s, "g");
text = text.replace(r, v);
}
}

//consonents + HAL
for (var i=0; i<consonants.length; i++){
r = new RegExp(consonants[i], "g");
text = text.replace(r, consonantsUni[i]+"්");
}
//vowels
for (var i=0; i<vowels.length; i++){
r = new RegExp(vowels[i], "g");
text = text.replace(r, vowelsUni[i]);
}

document.txtBox.box2.value=text;
    
}


// End -->

</script>

</head>
<body>
<center>
<table width="600px">
<tr>
<td>
<form name="txtBox" id="txtBox">
<span class="TableText">Unicode (යුනිකෝඩ්)</span><br />

<textarea onkeyup="startText();" onselect="startText();" onclick="startText();" style="font-size: 14pt; font-family: Potha, Malithi Web , Arial Unicode MS;
width: 600px;" name="box2" rows="7"></textarea>

</table>
</div>
</body>
</html>

＆＃13;

但我有两个问题，

按退格键无法删除字符。它会移除角色并再次显示相同的角色。
输入和转换之间存在延迟。当我输入一封信时，它并没有快速转换unicode。它还显示英文字母，然后转换为sinhala字符。如何消除这种延迟？

请帮我解决这个问题。在此先感谢： - ）

Answer 1

这是因为

charStr = charStr + String.fromCharCode(charCode);
text = charStr;

假设在按退格键之前，您的“text”=“aabbcc”
按下退格键时，首先按浏览器删除文本区域的最后一个字符（来自在按键事件之前触发的keydown事件）
此时，您的“文字”是：“aabbcc \ 8”，但您的textArea显示：“aabbc”
当您的按键完成后，keyStart（）继续其流程，并转到语句

document.txtBox.box2.value = text;

将文本区域的值设置为“aabbcc \ 8”（你不能看到\ 8字符，因为它是不可见的）

要使其与退格字符一起使用，请更改您的按键事件，如下所示：

 document.txtBox.box2.onkeypress = function(evt) {
   evt = evt || window.event;
   var charCode = evt.keyCode || evt.which;
   if (charCode == 8) {
      charStr = document.txtBox.value;
   } else {
      charStr = charStr + String.fromCharCode(charCode);
  }
 text = charStr;
 };

Answer 2

修正了这个问题：

我无法通过按退格键删除字符。它删除了字符并再次显示相同的角色。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html >
<head>
<title>Real Time Unicode Converter</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href="main.css" />
<style type="text/css">
@font-face {
font-family: Potha;
src: url(POTHA0.eot);
}
.english{
color: purple;
}
.sinhala{
font-family: Iskoola Pota;
color: navy;
}
.title{
font-familiy:Arial;
font-weight:bold;
color:navy;
}
.title2{
font-familiy:Arial;
font-weight:bold;
}
.link{
font-weight: bold;
color: green;
border-width: 1px;
border-style:solid;
border-color: green;
cursor:hand;
}
</style>

<script language="JavaScript" type="text/javascript">
<!-- Begin
var text = "";
var nVowels;
    var charStr = "";
var consonants= new Array()
var consonantsUni= new Array()
var vowels= new Array()
var vowelsUni= new Array()
var vowelModifiersUni= new Array()
var specialConsonants= new Array()
var specialConsonantsUni= new Array()
var specialCharUni= new Array()
var specialChar= new Array()


vowelsUni[0]='ඌ'; vowels[0]='oo'; vowelModifiersUni[0]='ූ';
vowelsUni[1]='ඕ'; vowels[1]='o\\)'; vowelModifiersUni[1]='ෝ';
vowelsUni[2]='ඕ'; vowels[2]='oe'; vowelModifiersUni[2]='ෝ';
vowelsUni[3]='ආ'; vowels[3]='aa'; vowelModifiersUni[3]='ා';
vowelsUni[4]='ආ'; vowels[4]='a\\)'; vowelModifiersUni[4]='ා';
vowelsUni[5]='ඈ'; vowels[5]='Aa'; vowelModifiersUni[5]='ෑ';
vowelsUni[6]='ඈ'; vowels[6]='A\\)'; vowelModifiersUni[6]='ෑ';
vowelsUni[7]='ඈ'; vowels[7]='ae'; vowelModifiersUni[7]='ෑ';
vowelsUni[8]='ඊ'; vowels[8]='ii'; vowelModifiersUni[8]='ී';
vowelsUni[9]='ඊ'; vowels[9]='i\\)'; vowelModifiersUni[9]='ී';
vowelsUni[10]='ඊ'; vowels[10]='ie'; vowelModifiersUni[10]='ී';
vowelsUni[11]='ඊ'; vowels[11]='ee'; vowelModifiersUni[11]='ී';
vowelsUni[12]='ඒ'; vowels[12]='ea'; vowelModifiersUni[12]='ේ';
vowelsUni[13]='ඒ'; vowels[13]='e\\)'; vowelModifiersUni[13]='ේ';
vowelsUni[14]='ඒ'; vowels[14]='ei'; vowelModifiersUni[14]='ේ';
vowelsUni[15]='ඌ'; vowels[15]='uu'; vowelModifiersUni[15]='ූ';
vowelsUni[16]='ඌ'; vowels[16]='u\\)'; vowelModifiersUni[16]='ූ';
vowelsUni[17]='ඖ'; vowels[17]='au'; vowelModifiersUni[17]='ෞ';
vowelsUni[18]='ඇ'; vowels[18]='/\a'; vowelModifiersUni[18]='ැ';
vowelsUni[19]='අ'; vowels[19]='a'; vowelModifiersUni[19]='';
vowelsUni[20]='ඇ'; vowels[20]='A'; vowelModifiersUni[20]='ැ';
vowelsUni[21]='ඉ'; vowels[21]='i'; vowelModifiersUni[21]='ි';
vowelsUni[22]='එ'; vowels[22]='e'; vowelModifiersUni[22]='ෙ';
vowelsUni[23]='උ'; vowels[23]='u'; vowelModifiersUni[23]='ු';
vowelsUni[24]='ඔ'; vowels[24]='o'; vowelModifiersUni[24]='ො';
vowelsUni[25]='ඓ'; vowels[25]='I'; vowelModifiersUni[25]='ෛ';
nVowels=26;

specialConsonantsUni[0]='ං'; specialConsonants[0]=/\\n/g;
specialConsonantsUni[1]='ඃ'; specialConsonants[1]=/\\h/g;
specialConsonantsUni[2]='ඞ'; specialConsonants[2]=/\\N/g;
specialConsonantsUni[3]='ඍ'; specialConsonants[3]=/\\R/g;
//special characher Repaya
specialConsonantsUni[4]='ර්'+'\u200D'; specialConsonants[4]=/R/g;
specialConsonantsUni[5]='ර්'+'\u200D'; specialConsonants[5]=/\\r/g;
consonantsUni[0]='ඬ'; consonants[0]='nnd';
consonantsUni[1]='ඳ'; consonants[1]='nndh';
consonantsUni[2]='ඟ'; consonants[2]='nng';
consonantsUni[3]='ථ'; consonants[3]='Th';
consonantsUni[4]='ධ'; consonants[4]='Dh';
consonantsUni[5]='ඝ'; consonants[5]='gh';
consonantsUni[6]='ඡ'; consonants[6]='Ch';
consonantsUni[7]='ඵ'; consonants[7]='ph';
consonantsUni[8]='භ'; consonants[8]='bh';
consonantsUni[9]='ශ'; consonants[9]='sh';
consonantsUni[10]='ෂ'; consonants[10]='Sh';
consonantsUni[11]='ඥ'; consonants[11]='GN';
consonantsUni[12]='ඤ'; consonants[12]='KN';
consonantsUni[13]='ළු'; consonants[13]='Lu';
consonantsUni[14]='ද'; consonants[14]='dh';
consonantsUni[15]='ච'; consonants[15]='ch';
consonantsUni[16]='ඛ'; consonants[16]='kh';
consonantsUni[17]='ත'; consonants[17]='th';
consonantsUni[18]='ට'; consonants[18]='t';
consonantsUni[19]='ක'; consonants[19]='k';
consonantsUni[20]='ඩ'; consonants[20]='d';
consonantsUni[21]='න'; consonants[21]='n';
consonantsUni[22]='ප'; consonants[22]='p';
consonantsUni[23]='බ'; consonants[23]='b';
consonantsUni[24]='ම'; consonants[24]='m';
consonantsUni[25]='‍ය'; consonants[25]='\\u005C' + 'y';
consonantsUni[26]='‍ය'; consonants[26]='Y';
consonantsUni[27]='ය'; consonants[27]='y';
consonantsUni[28]='ජ'; consonants[28]='j';
consonantsUni[29]='ල'; consonants[29]='l';
consonantsUni[30]='ව'; consonants[30]='v';
consonantsUni[31]='ව'; consonants[31]='w';
consonantsUni[32]='ස'; consonants[32]='s';
consonantsUni[33]='හ'; consonants[33]='h';
consonantsUni[34]='ණ'; consonants[34]='N';
consonantsUni[35]='ළ'; consonants[35]='L';
consonantsUni[36]='ඛ'; consonants[36]='K';
consonantsUni[37]='ඝ'; consonants[37]='G';
consonantsUni[38]='ඨ'; consonants[38]='T';
consonantsUni[39]='ඪ'; consonants[39]='D';
consonantsUni[40]='ඵ'; consonants[40]='P';
consonantsUni[41]='ඹ'; consonants[41]='B';
consonantsUni[42]='ෆ'; consonants[42]='f';
consonantsUni[43]='ඣ'; consonants[43]='q';
consonantsUni[44]='ග'; consonants[44]='g';
//last because we need to ommit this in dealing with Rakaransha
consonantsUni[45]='ර'; consonants[45]='r';

specialCharUni[0]='ෲ'; specialChar[0]='ruu';
specialCharUni[1]='ෘ'; specialChar[1]='ru';
//specialCharUni[2]='්‍ර'; specialChar[2]='ra';

function startText() {
var s,r,v;

    document.txtBox.box2.onkeydown = function(evt) {
    evt = evt || window.event;
    var charCode = evt.keyCode || evt.which;
       if(evt.keyCode == 8){
           charStr = charStr.substring(0, charStr.length - 1);
           text = charStr;
       }
       else{
           charStr = charStr + String.fromCharCode(evt.keyCode);
           text = charStr;
       }
    
};
    
//special consonents
for (var i=0; i<specialConsonants.length; i++){
text = text.replace(specialConsonants[i], specialConsonantsUni[i]);
}
//consonents + special Chars
for (var i=0; i<specialCharUni.length; i++){
for (var j=0;j<consonants.length;j++){
s = consonants[j] + specialChar[i];
v = consonantsUni[j] + specialCharUni[i];
r = new RegExp(s, "g");
text = text.replace(r, v);
}
}
//consonants + Rakaransha + vowel modifiers
for (var j=0;j<consonants.length;j++){
for (var i=0;i<vowels.length;i++){
s = consonants[j] + "r" + vowels[i];
v = consonantsUni[j] + "්‍ර" + vowelModifiersUni[i];
r = new RegExp(s, "g");
text = text.replace(r, v);
}
s = consonants[j] + "r";
v = consonantsUni[j] + "්‍ර";
r = new RegExp(s, "g");
text = text.replace(r, v);
}
//consonents + vowel modifiers
for (var i=0;i<consonants.length;i++){
for (var j=0;j<nVowels;j++){
s = consonants[i]+vowels[j];
v = consonantsUni[i] + vowelModifiersUni[j];
r = new RegExp(s, "g");
text = text.replace(r, v);
}
}

//consonents + HAL
for (var i=0; i<consonants.length; i++){
r = new RegExp(consonants[i], "g");
text = text.replace(r, consonantsUni[i]+"්");
}
//vowels
for (var i=0; i<vowels.length; i++){
r = new RegExp(vowels[i], "g");
text = text.replace(r, vowelsUni[i]);
}

document.txtBox.box2.value=text;
    
}

   // document.addEventListener('keydown', function (e) {
   //   if(e.keyCode == 8 && e.code == 'Backspace'){
   //      document.txtBox.box2.value=text.substring(0,text.length -1);
   //   }
   // }, false);

// End -->

</script>

</head>
<body>
<center>
<table width="600px">
<tr>
<td>
<form name="txtBox" id="txtBox">
<span class="TableText">Unicode (යුනිකෝඩ්)</span><br />

<textarea onkeyup="startText();" onselect="startText();" onclick="startText();" style="font-size: 14pt; font-family: Potha, Malithi Web , Arial Unicode MS;
width: 600px;" name="box2" rows="7"></textarea>

</table>
</div>
</body>
</html>

无法在javaScript中检测退格？

2 个答案: