How to trigger HTML button when you press Enter in textbox?
It is, yeah, 2021. And I believe this still holds true.
DO NOT USE keypress
keypress
event is not triggered when the user presses a key that does not produce any character, such as Tab, Caps Lock, Delete, Backspace, Escape, left & right Shift, function keys(F1 - F12).
keypress
event Mozilla Developer NetworkThe
keypress
event is fired when a key is pressed down, and that key normally produces a character value. Useinput
instead.
- It has been deprecated.
keypress
event UI Events (W3C working draft published on November 8, 2018.)
- NOTE | The
keypress
event is traditionally associated with detecting a character value rather than a physical key, and might not be available on all keys in some configurations.- WARNING | The
keypress
event type is defined in this specification for reference and completeness, but this specification deprecates the use of this event type. When in editing contexts, authors can subscribe to thebeforeinput
event instead.
DO NOT USE KeyboardEvent.keyCode
- It has been deprecated.
KeyboardEvent.keyCode
Mozilla Developer NetworkDeprecated | This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes. Avoid using it, and update existing code if possible; see the compatibility table at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any time.
What should I use then? (The good practice)
// Make sure this code gets executed after the DOM is loaded.
document.querySelector("#addLinks").addEventListener("keyup", event => {
if(event.key !== "Enter") return; // Use `.key` instead.
document.querySelector("#linkadd").click(); // Things you want to do.
event.preventDefault(); // No need to `return false;`.
});
$(document).ready(function(){
$('#TextBoxId').keypress(function(e){
if(e.keyCode==13)
$('#linkadd').click();
});
});