php – 如何使jQuery自动完成列表显示所有选项onfocus并隐藏选项

发布时间：2020-12-13 17:39:51 所属栏目：PHP教程来源：网络整理

导读：我有一个带有自动完成功能的表单,可以启动搜索“onfocus”并在用户点击搜索字段时显示选项列表,即使他们没有输入任何内容. 问题是自动完成需要使用键盘选择选项(向下箭头后跟制表符/返回或双击).我的第一个想法是,单击会使焦点保留在搜索字段中,因此自动完成

我有一个带有自动完成功能的表单,可以启动搜索“onfocus”并在用户点击搜索字段时显示选项列表,即使他们没有输入任何内容.

问题是自动完成需要使用键盘选择选项(向下箭头后跟制表符/返回或双击).我的第一个想法是,单击会使焦点保留在搜索字段中,因此自动完成保持可见.但是,第二次单击后搜索字段仍保持聚焦,但第二次单击后自动完成消失.

有任何想法吗？

<script>
$(document).ready(function() {

    var autocomplete_focus = function(){           
        if ($(this).val().length == 0) {
            $(this).autocomplete("search","%");
        }
    }   

    $( ".autocomplete" ).autocomplete({
            source: "../../db/autocomplete_list.php",minLength: 0
    });

    $( ".autocomplete" ).focus(autocomplete_focus);

});
</script>

我知道之前已经发布了similar question;但是,建议的解决方案对我不起作用.

解决方法

不确定这是否是可接受的解决方案,但实现此目的的一种方法是使用聚焦值填充输入.这可以防止菜单显示两次：

/* snip: */
focus: function (event,ui) {
    this.value = ui.item.value;
},

这是一个例子：http://jsfiddle.net/wxQf7/

尝试删除焦点事件处理程序以查看问题中的症状.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!