如果我在样式中设置了默认的大写字母,如何在同一个文本框中混合键入大写字母和小写字母


How to type mixing of caps and small letter in same textbox, if i set default uppercase in style?

我将默认文本设置为html中style(,即style="text-transform:capital")中文本框的大写字母。

我的查询是,我需要在文本框中键入大写字母和小写字母的混合,如下所示,

全球国际PVT有限公司

我该怎么办?请任何人帮我一个忙。

我假设您希望默认文本条目为大写,但在适当的时候允许小写(就像Caps Lock Key被锁定一样)。因此,我建议您不要指定所有大写字母的默认样式。您可以使用JavaScript拦截正在键入的文本,并在大写锁定键被锁定时操作文本:

这是我完整的(自测试以来)测试页面代码(根据我下面的评论,根据我的原始答案编辑):

<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8" />
 <title>test-page</title>
<script type="text/javascript">
//<!--
var bx, chr, indx, intvl, last, lng, ln2, str, tmp;
function PrepBox()
{ bx = document.getElementById("txtbx");
  bx.value = ""; //start with no text in box
  last = "";     //this will be the manipulated string
  lng = 0;       //its length
  intvl = setInterval("txtchk();", 100); //ten times per second
  return;
}
function txtchk()
{ tmp = bx.value;
  ln2 = tmp.length;
  if(ln2 < lng) //test for backspace
    last = tmp.substr(0,ln2);  //shorten the manipulated string
  else if(ln2 > lng)
  { str = tmp.substr(lng);      //get newly-typed character(s)
    for(indx=0; indx<str.length; indx++)  //for each one of them
    { chr = str.charAt(indx);             //get it
      if((chr >= "a") && (chr <= "z"))
        last += chr.toUpperCase();   //change lowercase to upper
      else if((chr >= "A") && (chr <= "Z"))
        last += chr.toLowerCase();   //change uppercase to lower
      else
        last += chr;   //periods, commas, semicolons, ...
  } }
  lng = ln2;  //update saved-length of "last"
  bx.value = last; //replace text in box with manipulated string
  return;
}
function ifenter(e)    //test for Enter key pressed
{ if((e.keyCode == 13) && (bx.value.length > 2)) //check minimum entry length
  { clearInterval(intvl);  //stop checking the box 10 times/second
    bx.blur(); //remove focus from box (ensures PrepBox() gets called for next entry)
    DoSomethingWithTheText(bx.value);
  }
  return;
}
function DoSomethingWithTheText(s)
{ tmp = document.createElement("span");
  tmp.innerHTML="<br />" + s;
  document.body.appendChild(tmp);  
  return;
}
// -->
</script>
</head>
<body>
<input id="txtbx" size="50" maxlength="40" type="text" style="font-size:10pt;" onfocus="PrepBox();" onkeydown="ifenter(event);" />

</body>
</html> 

请注意,如果用户按下/锁定Caps Lock键,则此代码将具有操纵文本框中字符串的效果,就好像该键尚未锁定一样!(对于任何感兴趣的人来说,txtchk()函数可以被编辑来做各种有趣的事情;我通常用它来擦除我不希望用户键入的字符。)

答案代码如下,

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Change caps to small</title>
<script type="text/javascript">
var bx, chr, indx, intvl, last, lng, ln2, str, tmp;
function PrepBox()
{
    bx = document.getElementById("txtbx");
    last = "";     //this will be the manipulated string
    lng = 0;       //its length
    intvl = setInterval("txtchk();", 100); //ten times per second
    return;
}
function txtchk()
{ 
tmp = bx.value;
ln2 = tmp.length;
if(ln2 < lng) //test for backspace
    last = tmp.substr(0,ln2);  //shorten the manipulated string
else if(ln2 > lng)
{ 
    str = tmp.substr(lng);   //get newly-typed character(s)
    for(indx=0; indx<str.length; indx++)  //for each one of them
    { 
        chr = str.charAt(indx);  
        if((chr >= "a") && (chr <= "z"))
            last += chr.toUpperCase();   //change lowercase to upper
        else  if((chr >= "A") && (chr <= "Z"))
            last += chr.toLowerCase();   //change uppercase to lower
        else
            last += chr;   //periods, commas, semicolons, ...
    }
}
lng = ln2;  //update saved-length of "last"
bx.value = last; //replace text in box with manipulated string
return;
}
</script>
</head>
<body>
<input id="txtbx" size="50" maxlength="40" type="text" style="font-size:10pt;" onFocus="PrepBox();" />
</body>
</html>

输出:
1.如果大写锁定关闭,默认键入文本为大写,如果我用shift键键入文本,则它变为小写
2.如果大写锁定打开,则默认键入的文本较小,如果我用shift键键入文本,则它变为大写