1

jquery-uiオートコンプリートを使用してリストを生成しています。このリストにカスタムクラスを適用して、my_list:first-childのようなCSSセレクタを使用してこのリストの最初の項目を参照できるようにしたいと思います。jqueryオートコンプリートで最初のリスト項目のスタイルを設定するにはどうすればよいですか?

次のコードを試しましたが、liタグのクラス指定子が失われています。助言がありますか?ここでの同様の質問は、renderItemにmonkey patchingを多重定義することについて話しますが、私がやりたいことは、これが過度に思われるクラス属性を指定することだけです。

.data('autocomplete')._renderItem = (ul, item) -> 
    $("<li class='my_list'></li>") 
    .data("item.autocomplete", item) 
    .append('<a>' + item.label + '</a>') 
    .appendTo(ul) 

答えて

3

あなたが深い表情of the outputを取る場合は、あなたのようなものでしょう:ような、スタイルのため

<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; } 

は、トリックを行います

enter image description here

質問に何か不足していますか?

+0

パーフェクト!おかげで@ balexandre – Jack

関連する問題