jQuery 自动完成:事件选择

发布于 2024-12-09 08:25:55 字数 494 浏览 0 评论 0原文

当从菜单中选择一个项目时,我试图提交表单。我在搜索表单上设置类,并使用事件选择,可以在此处找到: 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 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

丑疤怪 2024-12-16 08:25:55

这是因为 select 事件的默认行为是执行 您的事件处理程序完成运行后(以便您可以选择取消它)。

这意味着当您单击某些内容时,您的表单会在小部件有机会正确填充输入之前提交。

您应该能够通过执行小部件通常为您执行的操作来解决此问题:

$("#searchform-input").autocomplete({
    select: function (a, b) {
        $(this).val(b.item.value);
        $(".searchform1").submit()
    }
});

现在,您可能想知道是的,但是为什么当我使用键盘时它会起作用?

发生这种情况是因为< 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:

$("#searchform-input").autocomplete({
    select: function (a, b) {
        $(this).val(b.item.value);
        $(".searchform1").submit()
    }
});

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 the input (look closely; you'll see the input populated as you move up and down the list). When you mouseover an item, the focus event is called, populating the input. When you select something using the enter key, the correct value happens to be in the input because of the focus event.

↘人皮目录ツ 2024-12-16 08:25:55

呵呵。这个问题相当棘手,但解决起来却非常简单。只需在 select 事件之后将函数延迟 500 毫秒即可。它工作完美。工作完成! :)

$("#searchform-input").autocomplete({
select: function (a, b) {
    setTimeout(submit,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!! :)

$("#searchform-input").autocomplete({
select: function (a, b) {
    setTimeout(submit,500);
}});
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文