jQuery - 输入字段聚焦时带有回车键的目标按钮
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7937441/
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
jQuery - Target button with enter key when input field is focused
提问by user547794
I have an input field and a login button. I want to allow users to hit the "enter" key to click the button when the input field is focused. How would I do this with jQuery?
我有一个输入字段和一个登录按钮。我想让用户在输入字段聚焦时点击“输入”键来单击按钮。我将如何用 jQuery 做到这一点?
<input type="text" size="10" id="loginUserID" name="username">
<input type="button" value="Login" name="loginBtn" id="loginBtn">
回答by AlienWebguy
$('#loginUserID').keypress(function(event){
if(event.keyCode == 13){
$('#loginBtn').click();
}
});
回答by mu is too short
You don't need jQuery for this, just change the button to type="submit"
:
为此,您不需要 jQuery,只需将按钮更改为type="submit"
:
<input type="text" size="10" id="loginUserID" name="username">
<input type="submit" value="Login" name="loginBtn" id="loginBtn">
Then the <form>
will submit all by itself when you hit Enterinside the text input.
然后,<form>
当您点击Enter文本输入时,它将自行提交所有内容。
回答by nnnnnn
If they're in the same form and you change the button to be type="submit"
you should find it happens automatically, but anyway...
如果它们的形式相同并且您将按钮更改为,type="submit"
您应该会发现它会自动发生,但是无论如何......
$(document).ready(function() {
$('#loginUserID').keypress(function(e){
if(e.which === 13)
$('#loginBtn').click();
});
});
(Or you may prefer .keyup
or .keydown
.)
(或者您可能更喜欢.keyup
或.keydown
。)
回答by Piotr
The accepted answer, and most of the others, give for granted that the click() action might end event handling by submitting the form and switching to another page, or that there is not a submit somewhere on the form, so they omit stopping the event chain, but this might not be the case.
接受的答案以及大多数其他答案理所当然地认为 click() 操作可能会通过提交表单并切换到另一个页面来结束事件处理,或者表单上某处没有提交,因此他们忽略了停止事件链,但情况可能并非如此。
Don't forget to call e.preventDefault()
before calling click()
on the target button. Or else, the first button on the form will still fire on enter, in addition to your click!
e.preventDefault()
在调用click()
目标按钮之前不要忘记调用。否则,除了单击之外,表单上的第一个按钮仍会在回车时触发!
$('#loginUserID').keypress(function(event) {
if(event.keyCode == 13) {
e.preventDefault(); // Stop the default behaviour
$('#loginBtn').click();
}
});
回答by Roelof Meijer
The answer does not work when the trigger is somewhere attached in asp.net code adn not in js or jquery. What works fine is setting the focus on the button. In your case replace my named (sharepoint generated) fields with your login fields
当触发器附加在 asp.net 代码中而不是 js 或 jquery 中时,答案不起作用。什么工作正常是将焦点设置在按钮上。在您的情况下,用您的登录字段替换我的命名(共享点生成)字段
<script type ="text/javascript">
$(document).ready(function () {
var zoekveld = $( "input[name='ctl00$m$g_02abe20b_56ca_4744_a694_5bc31dd14f49$ctl02']" );
var loep = $( "input[name='ctl00$m$g_02abe20b_56ca_4744_a694_5bc31dd14f49$ctl04']" );
zoekveld.keypress(function(e){
//alert("gevonden op name");
var key = e.which;
if(key == 13){
//alert("op enter geklikt");
loep.focus();
}
});
});
</script>