[英]jQuery keypress to work normally except hitting enter
I would like to trigger a click
if enter is pressed inside an input
tag, but would like to have the default event strategy in all other cases. 如果要在input
标签中按下Enter键,我想触发一个click
,但是在所有其他情况下,我都希望具有默认的事件策略。 I have tried it this way: 我已经尝试过这种方式:
$("#keywords").keypress(function(e) {
if (e.charCode === 13) {
$("#campus-search").click();
} else {
$("#keywords").val($("#keywords").val() + String.fromCharCode(e.charCode));
}
});
It works, but I am still not satisfied, because when I click inside the input
somewhere in the middle of text or press the left button, or home button and then try to type some text, it will show it at the end of the input, which is bad user-experience. 它可以工作,但是我仍然不满意,因为当我在文本中间的某个位置单击input
内容或按左按钮或主页按钮,然后尝试键入一些文本时,它将在输入末尾显示,这是糟糕的用户体验。 Can I keep the input
to work in the default way except the case when enter is pressed? 除了按回车键的情况外,我能否保持input
以默认方式工作?
I think what you are looking for is this: 我认为您正在寻找的是:
$(document).ready(function () {
$("#test").keyup(function (event) {
if (event.keyCode == 13) {
$("#campus-search").click();
}
});
$("#campus-search").click(function () {
console.log("BUTTON IS CLICKED");
});
});
The input
will act completely normal and everything works on default
, unless when you press the enter button ( keyCode = 13 ), then the button .click()
event will be triggered. input
将完全正常,并且default
一切正常 , 除非按下Enter键( keyCode = 13 ),否则将触发button .click()
事件。
Working Fiddle: http://jsfiddle.net/Mz2g8/3/ 工作小提琴: http : //jsfiddle.net/Mz2g8/3/
———— ————
# Update : Just one hint for the code in your question, do not use charCode
, as it is deprecated . # 更新 :只是一个提示对你的问题的代码, 不使用charCode
,因为它已经过时了 。
This feature has been removed from the Web. 此功能已从Web上删除。 Though some browsers may still support it, it is in the process of being dropped. 尽管某些浏览器可能仍支持它,但是它正在被删除。 Do not use it in old or new projects. 不要在新旧项目中使用它。 Pages or Web apps using it may break at any time. 使用它的页面或Web应用程序可能随时中断。
(Eg charCode
does not work with FF v29.0.1) (例如charCode
不适用于FF v29.0.1)
And something different but important to know: 还有一些与众不同但很重要的知识:
charCode is never set in the keydown and keyup events. 在keydown和keyup事件中永远不会设置charCode。 In these cases, keyCode is set instead. 在这些情况下,将设置keyCode。
Source: https://developer.mozilla.org/en-US/docs/Web/API/event.charCode 来源: https : //developer.mozilla.org/en-US/docs/Web/API/event.charCode
The keypress
function does not capture non-printing keys, such as shift , esc , delete , and enter , so the best way to go about this would be have two event handlers: one for keypress
, as you have defined above, and one for keydown
that checks for the charCode
13 and then performs the click()
event on $(#campus-search)
if that keycode is passed (by an enter press). keypress
函数不能捕获非打印键,例如shift , esc , delete和enter ,因此,实现此目的的最佳方法是具有两个事件处理程序:一个用于上面定义的keypress
,另一个用于keydown
,用于检查charCode
13,然后在$(#campus-search)
上执行click()
事件$(#campus-search)
如果该Enter键通过了)。
This should work 这应该工作
$("#keywords").keypress(function(e) {
if (e.charCode === 13) {
e.preventDefault(); // prevent default action of the event if the event is keypress of enter key
$("#campus-search").click();
} else {
$("#keywords").val($("#keywords").val() + String.fromCharCode(e.charCode));
}
});
This is what you are looking for: 这是您要寻找的:
HTML: HTML:
<input id="keywords" type="text" value="" />
<input id="campus-search" type="button" value="Campus Search" />
JavaScript / jQuery: JavaScript / jQuery:
$("#keywords").keypress(function (e) {
if (e.charCode === 13) {
$("#campus-search").click();
} else {
$("#keywords").val($("#keywords").val() + String.fromCharCode(e.charCode));
}
});
$("#campus-search").on("click", function () {
alert("Searching..");
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.