键入时转换为大写，有一些延迟答案

【问题标题】：Convert to upper case while typing, with some delay键入时转换为大写，有一些延迟
【发布时间】：2012-10-20 18:03:59
【问题描述】：

我在输入时使用以下代码转换为大写。

      $(".input_capital").live('keypress', function(e)
      {
        var defaultStr = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
        var checkstr = $(this).val();
        var str1 = '';
        for (i = 0; i < checkstr.length; i++)
        {
            var ch = checkstr.charCodeAt(i);
             if (ch>=97 && ch<=122){
                str1 += defaultStr.charAt(ch-97);
             }else{
                str1 += checkstr.charAt(i);
              }
        }
        $(this).focus();
        $(this).val(str1);
     });

还有下面的代码

  $(".input_capital").live('keypress', function(e)
  {
       $(this).val($(this).val().toUpperCase());
  });

以上所有代码都可以正常工作。但是对于能够在一段时间内查看小写字母的用户。之后只有它转换为大写。

我尝试在 css 中使用“text-transform: uppercase”。但它不适用于带有 Android 操作系统的三星标签。请任何人帮助我通过脚本实现这一目标。

【问题讨论】：

您想要即时转换吗？？

标签： javascript jquery css

【解决方案1】：

试试：

$(".input_capital").live('keypress', function(e) {
    setInterval("$(this).val($(this).val().toUpperCase())",100);      
});

【讨论】：

最好使用一个包裹它的函数而不是一个字符串。

【解决方案2】：

为什么你不添加这一行

$(this).val($(this).val().toUpperCase());

在$(this).focus(); 之前？并使用on() 而不是live()

【讨论】：

我使用的是 jquery 5.1。因此，由于某些插件问题，我无法使用更高版本的 jquery。你能推荐任何其他的活动吗？

【解决方案3】：

如果你不关心 ie

$(".input_capital").bind("input", function(e){
   this.value = this.value.toUpperCase();
});

对于 IE

演示：http://jsfiddle.net/MupXZ/6/

【讨论】：

我使用的是 jquery 5.1。因此，由于某些插件问题，我无法使用更高版本的 jquery。你能推荐任何其他的活动吗？
@techfoobar 认为操作意味着1.5.1

【解决方案4】：

你可以试试：

$(".input_capital").on('keydown', function(evt) {
  $(this).val(function (_, val) {
    return val + String.fromCharCode(evt.which).toUpperCase();
  });

  return false;
});

http://jsfiddle.net/5gLyX/

它有一些缺陷，但我认为这个想法很明确，可以在此基础上进行构建。

更好的版本，但请注意 IEinput 事件。

$('.input_capital').on('input', function(evt) {
  $(this).val(function(_, val) {
    return val.toUpperCase();
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea class='input_capital' rows='8'></textarea>

【讨论】：

这很好。有一个问题。我无法在中间打字。它只会在最后显示键入的字符。
和箭头键、返回键和删除键在 chrome 中也不起作用
@RamarajKaruppusamy 这是意料之中的。如果你想修改它，你会有很多工作（基本上只针对 IE
另外，您不能按delete 按钮。如果您按下删除按钮，它会显示一些字符

【解决方案5】：

用 keyup 代替 keypress 怎么样？

$(".input_capital").live('keyup', function(e)
  {
       $(this).val($(this).val().toUpperCase());
  });

这样最后一个字母一放开就改变了。

像这样：http://jsfiddle.net/mNVXK/

【讨论】：

.live 不再可用
但是是在 2012 年 :)

【解决方案6】：

扩展@Yoshi's answer

这个扩展负责：

退格： 8
制表符： 9
输入： 13
方向键： 37,38,39,40

$(".input_capital").bind('keydown', function(event) {
    if ( $.inArray( event.keyCode, [8,9,13,37,38,39,40]) === -1 ) {
        $(this).val(function(i, val) {
            return val + String.fromCharCode(event.keyCode).toUpperCase();
        });
        return false;
    }
});

使用bind 因为OP 正在使用jQuery 1.5.1

【讨论】：

【解决方案7】：

对于那些使用更高版本的 jquery 的人，用 on 替换 live。例如。

 $(".input_capital").live('keyup', function(e)  {
   $(this).val($(this).val().toUpperCase());
});

现在

$(".input_capital").on('keyup', function(e)  {
   $(this).val($(this).val().toUpperCase());
});

【讨论】：

【解决方案8】：

Note: This answer is without delay..if you like to avoid Jquery

试试

<input type="text" style="text-transform: uppercase">

Demo - JSFiddle

【讨论】：

l o l 达曼！！有时我们想通过使用所有 jquery 的东西lol 来展示我们有多聪明，看看这个lol 来看看这个lol
这只给出了大写/小写文本的外观。如果您将值发送到服务器，它将是混合大小写的。
@DomenicD。是的，我在向服务器提交数据时遇到了麻烦

【解决方案9】：

js

$('.input_capital').on('blur', function(evt) {
  $(this).val(function (_, val) {
    return val.toUpperCase();
  });
});

html

<input type="text" class="input_capital" style="text-transform: uppercase" />

关注这个：http://jsfiddle.net/5gLyX/389/

【讨论】：