autoComplete (jquery.auto-complete.js)使用标签元数据完成类别

Question

我可以使用

做基本的标签和分类

http://jqueryui.com/autocomplete/类别

但我的需要没有使用

$。Widget ("custom.catcomplete";自动完成,{});

我是如何使用

做到这一点的

jQuery(".class")

.autoComplete ({});https://goodies.pixabay.com/jquery/auto-complete/demo.html

然而，我想知道是否有可能附加一些元数据与标签。例如…

"[{ label: "labelname1", category: "cat1" },{ label: "labelname2", category: "cat1" },
  { label: "labelname3", category: "cat2" },{ label: "labelname4", category: "cat2" },
  { label: "labelname5", category: "cat2" },
  ];"

我想这样写:

cat1

-labelname1

-labelname2

cat2

-labelname3

-labelname4

-labelname5

注意:仅由jQuery使用(".class")

.autoComplete ({});

ref:>https://goodies.pixabay.com/jquery/auto-complete/demo.html

Answer 1

我猜这是你要找的:

jQuery(document).ready(function($) {

  $( ".class" ).autocomplete({
  source: [ { label: "labelname1", category: "cat1" }, { label: "labelname2", category: "cat2" }, { label: "labelname3", category: "cat3" } ],
  select: function( event, ui ) {
            $( ".class" ).val( ui.item.label );
            return false;
        }
})
.data( "ui-autocomplete" )._renderItem = function( ul, item ) {
                return $( "<li>" )
                .data( "ui-autocomplete-item", item )
                .append( "<a>" + item.category + "<br>" + item.label + "</a>" )
                .appendTo( ul );
            };
 });

希望能有所帮助