jQuery 自动完成:事件选择
当从菜单中选择一个项目时,我试图提交表单。我在搜索表单上设置类,并使用事件选择,可以在此处找到: http://docs .jquery.com/UI/Autocomplete#event-select
现在,当您使用键盘(向上和向下)选择一个项目时,它就可以工作了。但是,如果您使用鼠标选择一个项目,它会为您提供之前输入的值。
检查此 screenr:http://www.screenr.com/7T0s
这是我用于提交的内容:
$("#searchform-input").autocomplete({
select: function (a, b) {
$(".searchform1").submit()
}
});
I am trying to submit a form when an item is selected from the menu. I set class on the search form and I am using the event select for it which is found here: http://docs.jquery.com/UI/Autocomplete#event-select
Now, when you select an item using the keyboard (UP and Down), it works. But if you select an item using the mouse, it gives you the value which is previously typed.
Check this screenr: http://www.screenr.com/7T0s
This is what I use for submitting:
$("#searchform-input").autocomplete({
select: function (a, b) {
$(".searchform1").submit()
}
});
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
这是因为
select
事件的默认行为是执行 在您的事件处理程序完成运行后(以便您可以选择取消它)。这意味着当您单击某些内容时,您的表单会在小部件有机会正确填充
输入
之前提交。您应该能够通过执行小部件通常为您执行的操作来解决此问题:
现在,您可能想知道是的,但是为什么当我使用键盘时它会起作用?
发生这种情况是因为< code>focus 事件实际上填充了
input
中的焦点项目(仔细观察;当您在列表中上下移动时,您会看到input
已填充) 。当您将鼠标悬停在某个项目上时,将调用focus
事件,填充input
。当您使用enter
键选择某些内容时,由于focus
事件,正确的值恰好位于input
中。This is because the
select
event's default behavior is executed after your event handler is finished running (so that you can cancel it if you so choose).This means that when you click something, your form is submitted before the widget has a chance to populate the
input
properly.You should be able to fix this by doing what the widget normally does for you:
Now, what you may be wondering is yes, but why does it work when I use the keyboard?
This happens because the
focus
event actually populates the focused item in theinput
(look closely; you'll see theinput
populated as you move up and down the list). When you mouseover an item, thefocus
event is called, populating theinput
. When you select something using theenter
key, the correct value happens to be in theinput
because of thefocus
event.呵呵。这个问题相当棘手,但解决起来却非常简单。只需在 select 事件之后将函数延迟 500 毫秒即可。它工作完美。工作完成! :)
Hehe. Quite tricky this one, but incredibly simple to solve. Just delay the function 500 milliseconds, after the select event. It works perfectly. JOB DONE!! :)