2

要求：

我想要一个 jQuery 自动完成元素，它允许用户选择一个项目并使用所选值设置显示字段和隐藏字段。但我也希望在输入字段获得用户焦点时清除该字段和隐藏字段。

问题：

我面临的问题是，当用户选择一个项目时，它几乎就像 jQuery 正在执行 onSelect 函数，然后再次将焦点发送到输入字段，这会触发我的 focus() 事件（并因此清除我的选择）。

问题浏览器：

IE8 ，在 Chrome 中工作。没有尝试其他人。

尝试修复：

  • 我尝试将焦点设置到select() 函数中的另一个元素。它确实将焦点放在了该元素上，但只是在关注输入字段之后
  • 在 select() 方法中event.preventDefault()都试过了。event.stopPropagation()不工作。
  • 模糊也没有用。

解决方法：

我想我可以将清除更改为单击而不是焦点，但这不是我想要的。

类似的stackoverflow线程：

提示后jquery自动完成删除焦点

代码： 这是我的代码：

$(function () {
    $("#autosuggest").autocomplete({
        source: "my server path",
        minLength: 3,
        select: function (event, ui) {
            if (ui.item) {
                $("#autosuggest").val(ui.item.value);                    
                $("#hidden").val(ui.item.id);                                                                                
            }
        }
    });
    $("#autosuggest").focus(function () {
        $("#hidden").val("");
        this.value = "";
    });

});
4

3 回答 3

2

问题是：当您单击自动完成建议时，焦点会很快转移到该下拉菜单，然后返回您的输入。如果您使用向下箭头按钮选择自动完成建议，您是否仍然遇到此问题？如果你不这样做，那么这就是问题所在。

我能看到解决这个问题的唯一方法毕竟不是让它成为焦点事件，但我想我知道你为什么不想让它成为点击事件：你还想在字段中捕获制表符。

解决方案：使它成为一个点击处理程序，并添加一个“keyup”处理程序，如果键是一个选项卡，则执行点击处理程序处理程序（仍然允许向下箭头等）。

于 2012-09-14T16:22:26.003 回答
0

尝试 onSelect 功能..

 $(function () {
    $("#autosuggest").autocomplete({
        source: "my server path",
        minLength: 3,
        select: function (event, ui) {
            if (ui.item) {
                $("#autosuggest").val(ui.item.value);                    
                $("#hidden").val(ui.item.id);                                                                                
            }
        },
        onSelect: function (suggestion) {
        $(this).click();}
    });
    $("#autosuggest").focus(function () {
        $("#hidden").val("");
        this.value = "";
    });

});
于 2017-10-22T18:31:27.073 回答
0

我从 jQuery 论坛得到了这个，它工作得非常好！

select: function(event, ui) {
 $(event.target).autocomplete("close")
 setTimeout(function() {
  $(event.target).blur();
 })
}

链接：https ://forum.jquery.com/topic/autocomplete-input-field-stays-focused-after-selection

于 2021-09-12T04:24:48.200 回答