如何设置jquery自动完成中第一个列表项的样式?

如何设置jquery自动完成中第一个列表项的样式?,jquery,jquery-ui,jquery-autocomplete,jquery-ui-autocomplete,Jquery,Jquery Ui,Jquery Autocomplete,Jquery Ui Autocomplete,我正在使用jQueryUIAutoComplete生成一个列表。我想对这个列表应用一个自定义类,这样我就可以使用css选择器(如my_list:first child)引用这个列表中的第一项 我尝试了以下代码,但是li标记上的类说明符丢失了。有什么建议吗?这里的类似问题讨论了使用monkey补丁重载renderItem,但考虑到我只想指定一个类属性,这似乎太过分了 .data('autocomplete')._renderItem = ( ul, item ) -> $( "<l

我正在使用jQueryUIAutoComplete生成一个列表。我想对这个列表应用一个自定义类,这样我就可以使用css选择器(如my_list:first child)引用这个列表中的第一项

我尝试了以下代码,但是li标记上的类说明符丢失了。有什么建议吗?这里的类似问题讨论了使用monkey补丁重载renderItem,但考虑到我只想指定一个类属性,这似乎太过分了

.data('autocomplete')._renderItem = ( ul, item ) ->
  $( "<li class='my_list'></li>" )
    .data( "item.autocomplete", item )
    .append( '<a>' + item.label + '</a>' )
    .appendTo( ul )
.data('autocomplete')。\u renderItem=(ul,项目)->
$(“
  • ”) .data(“item.autocomplete”,item) .append(“”+item.label+“”) .附录(ul)
    如果你仔细看一看,你会发现:

    <ul class="ui-autocomplete ui-menu ui-widget ui-widget-content ui-corner-all" role="listbox" aria-activedescendant="ui-active-menuitem" style="z-index: 1; display: block; width: 108px; top: 275px; left: 576px; ">
        <li class="ui-menu-item" role="menuitem">
            <a class="ui-corner-all ui-state-hover" tabindex="-1" id="ui-active-menuitem">ActionScript</a></li>
        <li class="ui-menu-item" role="menuitem">
            <a class="ui-corner-all" tabindex="-1">AppleScript</a></li>
        <li class="ui-menu-item" role="menuitem">
            <a class="ui-corner-all" tabindex="-1">Asp</a></li>
        <li class="ui-menu-item" role="menuitem">
            <a class="ui-corner-all" tabindex="-1">BASIC</a></li>
    </ul>
    
    这将起到关键作用:

    你的问题我遗漏了什么吗

    .ui-autocomplete li:first-child { background-color: red; }