I have a pretty basic set of things I want to do:

Capture key press, compare against an allowed list, block keys that are not in that list, replace a space by a dash if entered.

As this is happening, I have a span I wanted to be updated with the live values. The username field at https://twitter.com/signup is exactly what I am trying to do, though I have trouble dissecting how they did it.

Here is my attempt, which is off by one keypress for some reason. Any help is appreciated. Using 1.3.2 JQ.

<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
     $('input#the-name').bind('keypress', function(e) {
console.log('keycode: ' + e.which + ' actual: [' + String.fromCharCode(e.which) + ']');

          // Limit characters that can even be pressed
var c = String.fromCharCode(e.which); // Actual character pressed on keyboard var allowed = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890- ';
          // if we do not find actual letter in the list, stop.
if (e.which != 8 && allowed.indexOf(c) < 0) return false; // 8 is backspace

     })

     $('#the-name').keypress(function() {
          var entered = $('#the-name').val();
          $('#live').text(entered);
          console.log(entered);
     });
});
</script>

html parts:
<input type="text" name="the_name" value="" id="the-name" autocomplete="off" /><br />
http://example.com/<span id="live"></span><br />
--
Scott * If you contact me off list replace talklists@ with scott@ *

Reply via email to