Javascript 如何将CSS应用于此jQuery函数的结果?

Javascript 如何将CSS应用于此jQuery函数的结果?,javascript,jquery,css,Javascript,Jquery,Css,我希望以下搜索结果以无序列表的形式返回,并将其命名为“我的结果”。我无法在下面的代码中找到我的班级名称 HTML是动态生成的。页面上不存在这样的静态元素: <ul class="my-results"></ul> 这是我正在使用的函数 $(document).ready(function() { var cache = {}; $( '#top-search-input' ).autocomplete({ source: function

我希望以下搜索结果以无序列表的形式返回,并将其命名为“我的结果”。我无法在下面的代码中找到我的班级名称

HTML是动态生成的。页面上不存在这样的静态元素:

<ul class="my-results"></ul>
这是我正在使用的函数

$(document).ready(function() {
    var cache = {};
    $( '#top-search-input' ).autocomplete({
        source: function( request, response ) {
            if (request.term in cache) {
                response(cache[request.term]);
                return;
            }
            $.ajax({
                url: "http://example.com/search", 
                data: {
                    q: "*" + request.term + "*",
                    type: "Search",
                    view: "json",
                },
                dataType: "json",
                success: function( data ) {
                    if (data.length) {
                        cache[request.term] = data;
                    }
                    response(data);
                }
            });
        },
        minLength: 2,
        select: function( event, ui ) {
            window.location = ui.item.url;
        },
    }).data( 'ui-autocomplete' )._renderItem = function( ul, item ) {
        var elemHTML = $('<a></a>').attr('href', item.url);
            elemHTML.append('<span class="thumbnail"><img src="' + item.thumbnail + '" /></span>');
            elemHTML.append('<span class="title">' + item.title + '</span>');
        return $( '<li class="ui-menu-item" >' )
            .append( elemHTML )
            .appendTo( ul );
    };
});

在代码集的最后一行之后:

$("ul").addClass("my-results");

更新:更换发动机的内部零件

 data( 'ui-autocomplete' )._renderItem = function( ul, item ) {
为此:

var elemHTML = $('<a></a>').attr('href', item.url);
        elemHTML.append('<span class="thumbnail"><img src="' + item.thumbnail + '" /></span>');
        elemHTML.append('<span class="title">' + item.title + '</span>');
       // alert($('body').find('ul').hasClass("my_result"));
        if($("ul").hasClass("my_result")){
          //  console.log('if');
            return $('ul').append($( '<li class="ui-menu-item" >' )
                    .append( elemHTML ).append('</li>'));
        }else{
            // console.log('else');
        return  $('<ul class="my_result" >').append($( '<li class="ui-menu-item" >' )
                .append( elemHTML ).append('</li>')).appendTo('body');
        }

它应该适合您。

您在代码集的最后一行之后说过。我不知道你指的是哪一行。它似乎不能超出功能体。谢谢你为我澄清…身份很难理解。尝试后。附加到ul;我建议您,将“我的结果”的名称更改为“我的结果”。我将更改名称。但是如果我在后面加上这个,附加到ul;我不知道它是如何工作的,因为函数中return语句之后的任何内容都没有效果。我不太懂javascript,但这条规则应该适用于任何语言;“我的结果”类尚未在HTML中的任何位置定义。此函数返回的HTML是唯一具有此类名称的HTML。您将如何附加到页面上不存在的内容。最好使用createElement语句创建ul,然后将结果附加到此内容,然后将此ul附加到正文。我建议最好在有结果时将ul隐藏在页面上,然后仅附加并显示结果。我是说在您的dom中不会有任何ul,所以您将如何附加到它。完全正确!这就是我的观点。你的回答建议我附加到不存在的东西上。我希望你能给我一个有效的答案。ul是动态生成的,如本演示中所示:
var elemHTML = $('<a></a>').attr('href', item.url);
        elemHTML.append('<span class="thumbnail"><img src="' + item.thumbnail + '" /></span>');
        elemHTML.append('<span class="title">' + item.title + '</span>');
       // alert($('body').find('ul').hasClass("my_result"));
        if($("ul").hasClass("my_result")){
          //  console.log('if');
            return $('ul').append($( '<li class="ui-menu-item" >' )
                    .append( elemHTML ).append('</li>'));
        }else{
            // console.log('else');
        return  $('<ul class="my_result" >').append($( '<li class="ui-menu-item" >' )
                .append( elemHTML ).append('</li>')).appendTo('body');
        }