how to capture key repeats with javascript [duplicate]

问题

i have an asp.net form and an asp:textbox. i have a problem when the user presses and HOLDS a key down. the user selects the text box and then presses and holds '9' until the text box fills with 9s.

Is there any way to detect this situation? Is there a way to stop key repeats when the key is held down?

回答1:

Using jquery, you could do something like this:

<script type="text/javascript">

    var allowKey = true;

    $(function () {
        $("#one").keydown(function (e) {
            if (!allowKey) {
                e.preventDefault();
            }
            allowKey = false;
        });

        $("#one").keyup(function () {
            allowKey = true;
        });
    });

</script>

<input id="one" />

UPDATED BUG FIXES:

    var keyCount = 0;
    $(function () {
        $("#one").keypress(function (e) {
            if (keyCount > 1) {
                e.preventDefault();
            }
            keyCount++;
        });

        $("#one").keyup(function () {
            keyCount = 0;
        });
    });

回答2:

The following prevents autorepeated keypresses for "normal" keys (i.e. those that generate text input), even when several keys are pressed simultaneously. Note that the keypress event is the only event sure to be fired in all mainstream browsers for autorepeats and the keyCode value for a keydown event will not be the same as the charCode / which value for the corresponding keypress event, which complicates things a little.

Demo: http://jsfiddle.net/KRJ5m/

Code:

var textBox = document.getElementById("my_textbox");

var lastKeyDown, keyIsPressed = {}, keyCodeForCharCode = {},
    charCodeForKeyCode = {};

textBox.onkeydown = function(evt) {
    evt = evt || window.event;
    lastKeyDown = evt.keyCode;
};

textBox.onkeyup = function(evt) {
    evt = evt || window.event;
    var charCode = charCodeForKeyCode[evt.keyCode];
    if (charCode) {
        keyIsPressed[charCode] = false;
    }
};

textBox.onkeypress = function(evt) {
    evt = evt || window.event;
    var keyCode, charCode = evt.which || evt.keyCode;

    if (keyIsPressed[charCode]) {
        // This keypress is an autorepeat
        return false;
    } else {
        keyIsPressed[charCode] = true;

        // Get the key code for the corresponding keydown event
        keyCode = keyCodeForCharCode[charCode];
        if (!keyCode) {
            // Create two-way mapping for keyCode and charCode
            keyCodeForCharCode[charCode] = lastKeyDown;
            charCodeForKeyCode[lastKeyDown] = charCode;
        }
    }
};

回答3:

Using YUI's event handler, you could do something like this

var count = 0;
var kl = new YAHOO.util.KeyListener(document,{keys:27},                               
    {
      fn:function(e){
         if (count > 9){
            YAHOO.util.Event.preventDefault(e);
            // call a function here to do something
         }
         else count++;
      }
);

That would do the trick, then once your done your action, ensure count gets set back to 0.

Here is the link to the example http://developer.yahoo.com/yui/examples/container/keylistener.html

回答4:

This is a simple example of how I would lock down the key repetition with plain javascript:

var lock = false;

document.onkeyup = onKeyUpHandler;
document.onkeypress = onKeyPressHandler;

function onKeyUpHandler() {
    lock = false;
}

function onKeyPressHandler(e) {
    if (!e)
        e = window.event;
    var code = e.keyCode || e.which;
    if (lock != false) {
        e.returnValue = false;
        if (e.preventDefault) {
            e.preventDefault();
        }
    }   
    lock = true;
}

来源：https://stackoverflow.com/questions/2540335/how-to-capture-key-repeats-with-javascript

标签

javascript

html

keyevent

html-input