jQuery自动完成：事件

2018-06-23 06:42:44

我正在尝试从菜单中选择一个项目时提交表单。我在搜索表单上设置了类，并使用在此处找到的事件选择：http://docs.jquery.com/UI/Autocomplete#event-select

现在，当您使用键盘选择一个项目（向上和向下）时，它可以工作。但是，如果您使用鼠标选择一个项目，它将为您提供以前输入的值。

检查这个屏幕：http：//www.screenr.com/7T0s

这是我用来提交的内容：

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

这是因为select事件的默认行为是在事件处理程序运行完成后执行的（因此如果您愿意，可以取消它）。

这意味着当你点击一些东西时，你的表单会在widget有机会正确填充input之前被提交。

您应该能够通过执行Widget通常为您做的事情来解决这个问题：

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

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

发生这种情况是因为focus事件实际上将焦点项目填充到input （仔细观察;当您在列表中上下移动时，会看到input填充）。在鼠标悬停某个项目时，调用focus事件，填充input 。当您使用enter键选择某些内容时，由于focus事件，正确的值恰好位于input中。

呵呵。这个很复杂，但解决起来非常简单。在选择事件之后，只需延迟函数500毫秒。它完美的作品。任务完成！！ :)

$("#searchform-input").autocomplete({
select: function (a, b) {
    setTimeout(submit,500);
}});

链接地址: http://www.djcxy.com/p/65275.html

上一篇: jQuery Autocomplete: Event

下一篇: Possible to add large amount of DOM nodes without browser choking?