JQuery UIオートコンプリートで要素クラスを変更するにはどうすればいいですか？

Question

オートコンプリートは、この形式でデータを出力している：

<ul class="pageitem"> 
    <li class="menu"> 
    <a class="name">item 1</a> 
    </li> 
    <li class="menu"> 
    <a class="name">item 2</a> 
    </li> 
    <li class="menu"> 
    <a class="name">item 3</a> 
    </li> 
</ul> 

：私はそれを出力この方法でそれを作るためにそれを変更します

<ul class="ui-autocomplete ui-menu ui-widget ui-widget-content ui-corner-all"> 
    <li class="ui-menu-item"> 
    <a class="ui-corner-all">item 1</a> 
    </li> 
    <li class="ui-menu-item"> 
    <a class="ui-corner-all">item 2</a> 
    </li> 
    <li class="ui-menu-item"> 
    <a class="ui-corner-all">item 3</a> 
    </li> 
</ul> 

？私もjqueryスクリプトを変更しようとしましたが、それは私にとっては複雑すぎます。何を変更する必要がありますか？

Answer 1

クラスを変更しないでください。 jQuery UIはスタイリングだけでなくウィジェットを動作させるためのセレクタとしてもクラスを使用します。変更すると、動作中のプラグインはなくなります。あなたがあなた自身の意志で選択をスタイルする必要がある場合

あなたのニーズに応じて、あなたはjQueryので提供CSSファイルを編集したり、自分自身のクラスを追加する必要があります。

私はあなたがアンカー後、のLIにスパンを追加したい場合は、...

をそれらのクラスを削除する「オープン」コールバックを使用して、このようなものはありません、リピート：

$(".selector").bind("autocompleteopen", function(event, ui) { 
    $(this).find('li.ui-menu-item').each(function(index){ 
     var span = $('<span>'); 
     $(span).text('whatever you want'); 
     $(this).append($(span)); 
    }); 
}); 

Answer 2

$('.ui-autocomplete.ui-menu.ui-widget.ui-widget-content.ui-corner-all').addClass('pageitem').removeClass('ui-autocomplete ui-menu ui-widget ui-widget-content ui-corner-all'); 

$('.ui-menu-item').addClass('menu').removeClass('ui-menu-item'); 

$('.ui-corner-all').addClass('name').removeClass('ui-corner-all'); 

Answer 3

私はopencartためのテンプレートで働いていた、そして特定のTPLで、tracking.tpl私はオートコンプリートリスト位置に問題がありました。

私はおよそ多くの知識を持っていけない悪い、javascritを知っている人のための非常にシンプルなが存在する場合があります。

生成されたポイントがほとんど見つからなかった。

さて、私はそれを得ました。 のZIndex（this.element.zIndex（）+ 1）の.css（{上部：0、左：0}）jqueryの-UI-1.8.16.custom.min.jsで私はそれを検索しましたは、位置や必要なものを変更するために、上下を変更するだけです。

私が知っている、その悪い非常に単純ではない見つけるにとてもシンプル。

私はこれが同じ問題を持つ他の人に役立つことを願っています。