3赞

单击jQuery autoComplete查看全部？

作者：N个小灰流_701 | 2023-08-21 13:13

如何解决《单击jQueryautoComplete查看全部？》经验，为你挑选了6个好方法。

我以一种相对简单的方式使用jQuery的自动完成:

$(document).ready(function() {
  var data = [ {text: "Choice 1"}, 
               {text: "Choice 2"}, 
               {text: "Choice 3"} ]

$("#example").autocomplete(data, {
  matchContains: true,
  minChars: 0,
  formatItem: function(item) 
    { return item.text; }
    }
  );
  });

如何添加一个onclick事件(如按钮或链接),它将显示自动完成的所有可用选项？基本上我正在寻找自动完成和选择/下拉元素的混合.

谢谢!

1> Tom Pietrosa..：

您可以触发此事件以显示所有选项:

$("#example").autocomplete( "search", "" );

或者参见下面链接中的示例.看起来就像你想要做的.

http://jqueryui.com/demos/autocomplete/#combobox

编辑(来自@cnanney)

注意:您必须在自动完成中为空搜索字符串设置minLength:0以返回所有元素.

对我来说很棒.您必须在自动完成中设置`minLength:0`以获取空搜索字符串以返回所有元素.我被设置为1,并花了一点时间来弄清楚为什么不工作.

这完美地工作!我改变了一点,在我的输入元素上放了`onfocus ="javascript:$(this).autocomplete('search','');"`.谢谢您的帮助!

这是正确的答案.如果有一个`.show()`选项会很好!

2> Craig..：

我觉得这个效果最好

var data = [
    { label: "Choice 1", value: "choice_1" },
    { label: "Choice 2", value: "choice_2" },
    { label: "Choice 3", value: "choice_3" }
];

$("#example")
.autocomplete({
    source: data,
    minLength: 0
})
.focus(function() {
    $(this).autocomplete('search', $(this).val())
});

它搜索标签并将值放入元素$(#example)

我最喜欢这个答案,因为如果您使用 Tab 在输入之间切换焦点,则很明显文本输入具有自动完成功能.有些人不使用鼠标点击一切;)

3> karim79..：

我无法在文档中看到明显的方法,但您尝试在启用自动填充的文本框上触发焦点(或单击)事件:

$('#myButton').click(function() {
   $('#autocomplete').trigger("focus"); //or "click", at least one should work
});

请参阅Tom Pietrosanti关于如何在不使用触发器或按钮的情况下执行此操作的答案.

请参阅下面的Craig的答案.

4> Nine Tails..：

为了显示所有项目/模拟组合框行为,首先应确保将minLength选项设置为0(默认值为1).然后,您可以绑定click事件以使用空字符串执行搜索.

$('inputSelector').autocomplete({ minLength: 0 });
$('inputSelector').click(function() { $(this).autocomplete("search", ""); });

5> 小智..：

尝试这个：

    $('#autocomplete').focus(function(){
        $(this).val('');
        $(this).keydown();
    });

和minLength设置为0

每次都可以工作:)

6> 小智..：

解决方案来自：在焦点事件上显示jquery ui自动完成列表

使它多次运行的解决方案






















    

    
        
            
            
                
                    
                
            

            
                N个小灰流_701            

            
                这个屌丝很懒，什么也没留下！            
            
            

                                
                    
                    关注作者
                            

        
    


    
        Tags | 热门标签
        
            
                                
                    actionscrip
                
                                
                    bash
                
                                
                    c#
                
                                
                    c++
                
                                
                    c语言
                
                                
                    erlang
                
                                
                    flutter
                
                                
                    go
                
                                
                    golang
                
                                
                    java
                
                                
                    javascript
                
                                
                    lua
                
                                
                    node.js
                
                                
                    perl
                
                                
                    php
                
                                
                    python
                
                                
                    scala
                
                                
                    typescript
                
                                
            
        
    


    
        RankList | 热门文章
        
            
                                
                    1在JS中将vh单位转换为px
                
                                
                    2为什么lambda和匿名方法不允许在左侧或作为运算符？
                
                                
                    3如何避免在Swift2中嵌套do/catch语句
                
                                
                    4如何正确地将MIDI刻度转换为毫秒？
                
                                
                    5生成器不是迭代器？
                
                                
                    6通过EWS发送邮件时如何获取保存发送副本的ItemId
                
                                
                    7关于`namedtuple`的一些内容在3.5.1中有所改变吗？
                
                                
                    8如何为PyPy安装lxml？
                
                                
                    9带有函数的参数和指针在C中的函数内部
                
                                
                    10Jackson JSON如何设置http连接和读取超时
                
                                
                    11面向iOS 9.0及更高版本的iPad应用需要83.5x83.5@2x app图标
                
                                
                    12在Raspberry Pi debian中启动脚本上的Python编码问题
                
                                
                    13设计时错误查找资源字典 - 项目之间不一致
                
                                
                    14最后一行打印两次(C++)
                
                                
                    15将元组的字符串转换为元组
                
                                
                    16Sitecore发布和滞后时间长达30秒
                
                                
                    17选择新标签后,选择2:更新选项
                
                                
                    18有没有办法打印jupyter/ipython笔记本幻灯片演示文稿？
                
                                
                    19同时使用ServiceStack和SimpleInjector来修复API服务
                
                                
                    20Safari History.db history_visits.visit_time的格式是什么？

DevBox开发工具箱 | 专业的在线开发工具网站