jQuery 模糊和回车键
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5432428/
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 blur and the enter key
提问by Jon Harris
I am trying to update a div dynmically with a googlemap based on a zip code being entered. Its working fine if the user tabs away from the input box (id ZipCode) but if they press enter it doesn't blur the field. I have got a variation on this working with onkeyup, but one event calls the other and its a mess. Is it possible to kick the function off if either event occurs.
我正在尝试使用基于输入的邮政编码的 googlemap 动态更新 div。如果用户远离输入框（id ZipCode），它工作正常，但如果他们按下回车键，它不会模糊该字段。我在使用 onkeyup 时有一个变体，但是一个事件调用另一个事件，而且一团糟。如果任一事件发生，是否可以启动该功能。
$(document).ready(function() {
$("#ZipCode").blur(function() {
$("#dynamic").load('googlemap.php', {zipcode: $('#ZipCode').val(), maxdistance: $("input[name='MaxDistance']:checked").val() },
function() {
});
});
}) ;
Thanks for any pointers.
感谢您的指点。
回答by Town
You can do this:
你可以这样做：
$(document).ready(function() {
$("#ZipCode").bind('blur keyup',function(e) {
if (e.type === 'blur' || e.keyCode === 13)
// do your stuff here
});
});
Syntax: event.keyCode
Return Value: A Number, representing either a Unicode character code or the Unicode key code
语法：event.keyCode
返回值：一个数字，表示 Unicode 字符代码或 Unicode 键码
回答by William Niu
After re-reading your question, I think what you want to do is, when the textbox (i.e. #ZipCode) is blurred, update the googlemap element; when enter key is pressed, blur the textbox, which in turn update the googlemap element.
重新阅读您的问题后，我认为您想要做的是，当文本框（即#ZipCode）模糊时，更新 googlemap 元素；当按下 Enter 键时，模糊文本框，从而更新 googlemap 元素。
In your comment you mentioned that, you don't want the Enter key to submit the form. You may need to handle the keypressevent as well.
在您提到的评论中，您不希望 Enter 键提交表单。您可能还需要处理该keypress事件。
$(document).ready(function() {
$("#ZipCode").blur(function() {
$("#dynamic").load('googlemap.php', {zipcode: $('#ZipCode').val(), maxdistance: $("input[name='MaxDistance']:checked").val() },
function() {
});
});
$("#ZipCode").keyup(function(e) {
if (e.which == 13) // Enter key
$(this).blur();
});
// prevent the Enter key from submitting the form
$('#ZipCode').keypress(function(e) { return e.which != 13; });
}) ;
回答by Andy Edinborough
You could do this:
你可以这样做：
$(document).ready(function() {
$("#ZipCode").bind('blur keyup', function(e) {
if(e.type === 'keyup' && e.keyCode !== 10 && e.keyCode !== 13) return;
$("#dynamic").load('googlemap.php', {zipcode: $('#ZipCode').val(), maxdistance: $("input[name='MaxDistance']:checked").val() },
function() {
});
});
}) ;
回答by Apoorv Nag
To allow only one event occurs. You can call the desired function in both the events blurand keypress. Finally the actual or desired function has to be called in blur event. Example<input disabled="true" type="text" placeholder="Enter Start Location" id = "fromPlaceEntry" onkeypress="startHandlingFromSubmission(event)" onblur="startHandlingFromSubmission(event)">
We can call the startHandlingFromSubmission()function in the following way.
只允许一个事件发生。您可以在事件blur和keypress. 最后，必须在模糊事件中调用实际或所需的函数。示例<input disabled="true" type="text" placeholder="Enter Start Location" id = "fromPlaceEntry" onkeypress="startHandlingFromSubmission(event)" onblur="startHandlingFromSubmission(event)">
我们可以startHandlingFromSubmission()通过以下方式调用该函数。
function startHandlingFromSubmission(e){
if(e.keyCode===13){ //To check enter event
$(e.target).blur();
}
if(e.keyCode===0){ //To check span event
setTimeout(function() {
handleFromPlaceSubmission(e);
}, 200);
}
}
function handleFromPlaceSubmission(e){
//This is the actual function which we desire to call
if(e.keyCode === 0){ //executing only in case of blur event
// your code goes here
}
}
