javascript - 在 jQuery UI 自动完成中处理输入按键事件

标签 javascript jquery jquery-ui jquery-ui-autocomplete

有没有办法处理在 jquery 自动完成功能中按下回车键的事件?如果我点击下拉结果项,我会转到以下网址

window.location.href = '/user?userId=' + ui.item.userId;

它在功能的选择部分工作正常。但是,如果我在输入一些字母并显示下拉结果列表时需要更改我的 url,但我没有单击其中一个项目,而是只按了回车键,我该如何处理呢?

$('#search').autocomplete({
    source: function(request, response) {
        $.ajax({
            url: "/search/users",
            data: {
                query: request.term
            },
            success: function(data) {
                var transformed = $.map(data, function(el) {
                    return {
                        name: el.name,
                        email: el.email
                    };
                });
                response(transformed);
            },
            error: function() {
                response([]);
            }
        });
    },
    select: function(event, ui) {
        window.location.href = '/user?userId=' + ui.item.userId;
    }
}).data("ui-autocomplete")._renderItem = function(ul, item) {
    var $a = $("<a></a>").append(item.name);
    highlightText(this.term, $a);
    return $("<li></li>").append($a).appendTo(ul);
};

我试过这个,但我想知道是否有更好的解决方案

$('#search').on('keypress', function(e) {
    if (e.which == 13 && $(this).val()) {
        window.location.href = '/users/list?name=' + $(this).val();
    }
});

最佳答案

按键的想法没有错。如果您想要替代解决方案,我建议您使用 form 标记:

<form action="/users/list" method="get">
    <input id="search" name="name">
</form>

如果自动完成菜单未激活,则表单将在按下回车后提交。

关于javascript - 在 jQuery UI 自动完成中处理输入按键事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27524783/

相关文章:

javascript - 是否有原因导致括号运算符 [] 可能无法在 React 组件中与 getElementsByClassName() 一起使用?

javascript - Highcharts 从数据库获取数据

jquery - z-index 在 Internet Explorer 中不起作用

jquery - Uncaught Error : cannot call methods on dialog prior to initialization; attempted to call method 'option'

javascript - 如何将 jquery ui Slide Ranger 中的最小值和最大值获取到 2 个单独的变量中?

javascript - react : how to lift props up to parent component?

javascript - 我用 jquery ajax 一个文件,但我不知道它下载到哪里

javascript - 解析 CSV 文件时出现问题

javascript - jquery 验证插件没有提交按钮

javascript - 如何使用 jQuery 添加 ul 元素自定义事件?