捕获 Enter 键以使用 javascript 单击按钮
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4357654/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Capturing the Enter key to cause a button click with javascript
提问by Swell
i want to Capturing the Enter key to cause a button click
我想捕获 Enter 键以导致单击按钮
i have this javascript:
我有这个 javascript：
function doClick(buttonName,e)
{
//the purpose of this function is to allow the enter key to
//point to the correct button to click.
var key;
if(window.event)
key = window.event.keyCode; //IE
else
key = e.which; //firefox
if (key == 13)
{
//Get the button the user wants to have clicked
var btn = document.getElementById('submit');
if (btn != null)
{ //If we find the button click it
btn.click();
event.keyCode = 0
}
}
}
with html
与 html
<input type="button" id="submit" value="Search" onClick="doSomeThing();" />
<input type="text" name="search" onKeyPress="doClick('submit',event)" />
this is work fine with IE browser but it didn't with Firefox,
这适用于 IE 浏览器，但不适用于 Firefox，
Why ? can anybody fix this javascript code to work on all browsers.
为什么 ？任何人都可以修复此 javascript 代码以在所有浏览器上工作。
thank you
谢谢
回答by Jacob Relkin
You should really not use inline event handlers:
你真的不应该使用内联事件处理程序：
window.onload = function() {
document.getElementById('submit').onclick = doSomething;
document.getElementById('search').onkeypress = function(e) {
doClick('submit', e);
};
};
function doClick(buttonName,e)
{
//the purpose of this function is to allow the enter key to
//point to the correct button to click.
var ev = e || window.event;
var key = ev.keyCode;
if (key == 13)
{
//Get the button the user wants to have clicked
var btn = document.getElementById(buttonName);
if (btn != null)
{
//If we find the button click it
btn.click();
ev.preventDefault();
}
}
}
Your HTML should then look like this:
您的 HTML 应如下所示：
<input type="button" id="submit" value="Search"/>
<input type="text" name="search" id="search" />
回答by Tim Down
I'd suggest using the keydownevent instead for this particular case, since it simplifies key detection: you can use keyCodein all browsers. Also, you're passing in the ID of the button you want to click but then not using it, so I've changed that. Also, I've added a return falseto prevent the default behaviour of pressing the enter key, (although this part won't have any effect in Opera: you'll need to suppress the keypressevent instead in that browser):
我建议在keydown这种特殊情况下使用该事件，因为它简化了按键检测：您可以keyCode在所有浏览器中使用。此外，您传入了要单击但未使用的按钮的 ID，因此我已更改它。此外，我添加了一个return false以防止按下回车键的默认行为，（尽管这部分在 Opera 中不会有任何影响：您需要keypress在该浏览器中取消该事件）：
function doClick(buttonId, e)
{
if (e.keyCode == 13)
{
// Get the button the user wants to have clicked
var btn = document.getElementById(buttonId);
if (btn)
{
btn.click();
return false;
}
}
}
}
回答by sa125
Why not use a wrapper js framework like jQuery? It does all the cross-browser stuff for you. Just off the top of my head, this could work (still, you should probably verify):
为什么不使用像 jQuery 这样的包装器 js 框架？它为您完成所有跨浏览器的工作。就在我的脑海里，这可以工作（仍然，你应该验证）：
jQuery(function(){
jQuery(window).keyup( function(e){
if (e.keyCode == 13) {
// handle click logic here
}
});
});
回答by Mahaveer
onKeydown
按键按下
if (event.keyCode == 13) {
document.getElementById('submit').click();
return false;
}
