Question

我试图在结果集的末尾追加<li>但没有成功。我对结果集的长度一无所知，因为它可以根据输入进行更改，因此我设置的计数器仅在结果达到限制时才有效。

我找到的文档on the jquery ui site让我了解到这一点。

我事先启动了一个计数器，并设置条件以根据窗口变量对某些数据进行排序。以下是我的工作内容：

$('#q').autocomplete({...}).data( "autocomplete" )._renderItem = function( ul, item ) {
        if(autoCount == 0){
           $('<img src="/ac-top-arrow.png" class="ac-top-arrow" />').appendTo(ul);
        }

        if(item.window){
            var inLi = $('<li class="in-window"></li>')
            .data( "item.autocomplete", item )
            .append( '<a><img src="'+item.thumb+'" width="55" height="75" class="imgposter" /><div class="movie-info"><h1>'+item.title + '</h1> <span>('+item.year+')</span><br>' + '<h2>Watch now</h2></div></a>');

            if($('ul.ui-autocomplete li.in-window').length){
                $('.in-window:last').after(inLi);
            } else if($('ul.ui-autocomplete li.out-window').length) {
                $(inLi).addClass('first-in-win');
                $('.out-window:first').before(inLi);
            } else {
                $(inLi).addClass('first-in-win');
                $(inLi).appendTo('ul.ui-autocomplete');
            }
        }
        else {
            var outLi = $('<li class="out-window"></li>')
            .data( "item.autocomplete", item )
            .append( '<a><h1>'+item.title + '</h1> <span>('+item.year+')</span></a>');

            if($('ul.ui-autocomplete li.out-window').length){
                $('.out-window:last').after(outLi);
            } else {
                $(outLi).addClass('first-out-win');
                $(outLi).appendTo(ul);
            }
            if(autoCount == 5){
                $(outLi).addClass('after-top');
            }
        }


        autoCount++;

        if(autoCount == 6){
            $('<li class="bottom"><a href="">> See All Results</a></li>').appendTo(ul);
            autoCount = 0;
        }
    };

Answer 1

这实现了我想要的目标：

'open': function(e, ui) {$('.ui-autocomplete').append('<li class="bottom ui-menu-item"><a href="#" id="see-more-results">> See All Results</a></li>');}

自动填充的自定义数据/布局

1 个答案: