鍵入時轉換為大寫，有一些延遲

Question

我在輸入時使用以下代碼轉換為大寫。

      $(".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 Os的三星標簽。 請任何人幫助我通過腳本實現這一目標。

Answer 1

你可以試試：

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

  return false;
});​

http://jsfiddle.net/5gLyX/

它有一些缺陷，但我認為這個想法是明確的，並且可以建立在其上。

---

更好的版本 ，但請注意IE <9不支持的input事件。

 $('.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> 

Answer 2

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

嘗試

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

演示 - JSFiddle

Answer 3

如果你不在乎ie <9，請聽“輸入”事件

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

對於IE <9，請改用“keyup”

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

Answer 4

如何使用keyup而不是keypress。

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

因此，一旦釋放密鑰，最后一個字母就會被更改。

像這樣： http ： //jsfiddle.net/mNVXK/

Answer 5

為什么你不添加這一行

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

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

Answer 6

延伸@Yoshi的答案

此擴展程序負責：

退格： 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

Answer 7

嘗試：

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

Answer 8

對於那些使用更高版本的jquery替換live with on的人。 例如。

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

就是現在

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

Answer 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/