Convert to upper case while typing, with some delay

css, javascript, jquery

Solution

you can try:

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

  return false;
});​

http://jsfiddle.net/5gLyX/

It has some flaws, but I think the idea is clear, and can be build upon.

Better version, though mind the `input` event which is not supported in IE<9.

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

Problem

I used following codes to convert to upper case while typing. ``` $(".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); }); ``` And the following code ``` $(".input_capital").live('keypress', function(e) { $(this).val($(this).val().toUpperCase()); }); ``` all these above code is working fine. But for user able to view lower cases for some time. After that only its converting to upper case. I tried with '`text-transform: uppercase`' in css. But it is not working in Samsung tab with Android Os. Please anybody help me to achieve this by script.

Original source

Related problems