-->

KeyboardEvent in Chrome, keyCode is 0

2019-01-14 06:31发布

问题:

I am trying to set keyCode on dispatched event object .

On button click, event is raised on textbox control to simulating keydown event. Event is raised successfully, but keyCode is 0. I need to send event object with correct keyCode to textbox. I've been using code from here.

How to set keyCode value in dispatched event?

<html>
    <head>      
    </head>
    <body>
        <input type="button" id="btn" value="Click"></input>
        <input type="text" id="txt"></input>
        <script>
            document.getElementById('btn').addEventListener("click", btnClick);
            document.getElementById('txt').addEventListener("keydown", txtKeydown);         

            function btnClick(e) {
                var txt = document.getElementById('txt');               

                var dispatchKeyboardEvent = function(target, initKeyboradEvent_args) {
                    var e = document.createEvent("KeyboardEvents");
                    e.initKeyboardEvent.apply(e, Array.prototype.slice.call(arguments, 1));
                    e.keyCode = 83;
                    e.charCode = 0;
                    target.dispatchEvent(e);
                };

                var canceled = !dispatchKeyboardEvent(txt,
                'keydown', true, true,  // type, bubbles, cancelable
                window,  // window
                's',  // key
                0, // location: 0=standard, 1=left, 2=right, 3=numpad, 4=mobile, 5=joystick
                false, false, false);  // Ctr, Alt, Shift
            }

            function txtKeydown(e) {
                console.dir(e);
                console.log(e.keyCode);
            }

        </script>
    </body>
</html>

回答1:

I am amazed that this bug has been sitting there for ages. There seems to be a workaround using generic events. Here's a demo: http://jsbin.com/awenaq/3



回答2:

It looks like it's been a bit since you asked this so you may have already found the answer to your question. In case you haven't though, there is a bug in Webkit as was pointed out in this SO question that causes the keyCode to always be 0. Apparently there's not much you can do until they fix it. Sadly it doesn't look like anyone is really working on it though. It's not the answer you want to hear, but it's really the only answer anyone can give you for this right now.



回答3:

I have faced same issue with Android devices like, Sony Xperia and HTC Devices. So i found alternate solution: please refer to my answer for this question KeyCode Returns 0 Always



回答4:

If you have jQuery:

$.Event(event, { keyCode: 13 });

This is the intended use.
Source.



回答5:

This happens because (as others have stated) the KeyboardEvent object (which uses charCode instead of keyCode) is being called instead of the Event object. When you are using:

function txtKeydown(e) {
    console.dir(e);
    console.log(e.keyCode);
}

if you're getting a 0 printed to the console, try using e.charCode instead of e.keyCode

refer to MDN web docs for more information regarding KeyboardEvent: https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent



回答6:

It is not a bug... this feature is being weeded out, deprecated, forbidden, whateva' the name will be tomorrow... You cannot rely on this feature to work for long. ...and is a wide open security risk... find another way to do what you are trying to do. Consult the MOZILLA specs and you will see the BIG BAD RED BANNER which warns to avoid this like the plague. They will not fix it, by returning 0 they effectively stop the bleeding without changing the code except in one place where it always zaps the keyCode to 0.