在单独的函数中跟踪输入字段中的用户按键

Question

I want to track user key presses in input field in a separate function and call a function based on onkeydown value. What I have below just doesn't work. Nothing happens. I'm open to eye-opening revelations and commentary. I think I'm missing something major.

 function find_key(Fval, Fid) { //prevents malicious characters if ((event.charCode <= 47) || (event.charCode >= 64)) { return; }; // user presses ctrl + delete // this doesn't work, nothing happens if (event.code == 46 && (event.ctrlKey || event.metaKey)) { alert('Undo!'); } // user presses ctrl + enter // this doesn't work, nothing happens if (event.ctrlKey && e.keyCode == 13) { alert("grab"); grabName(Fval, Fid); } }

 <input onkeydown="find_key(this,this.id);" id="P${i}" />

I tried this based on a suggestion: (it doesn't work, though)

`<input class = 'tiger' id = "P${i}"  />`;

document.getElementsByClassName('tiger').addEventListener('keypress', findKey);

function find_key (e) {

if (event.code == 46 && (event.ctrlKey || event.metaKey)) 
{ alert('Undo!'); }

Answer 1

You need to pass event as an argument (please note exact argument name "event" must be used).

<input onkeydown = "find_key(event, this, this.id);" id = "P${i}"  />;

And then in js

function find_key (event, Fval, Fid) {
    //...
}

PS why not using document method in js code and adding event listener to your input directly?

document.getElementById('input_el_id').addEventListener('keydown', findKey);

function findKey(e) {
    //...
}