键入任何内容时搜索匹配关键字

时间:2014-07-05 13:33:57

标签: javascript jquery html ajax

我刚接触编程。

请不要介意它是一个简单的问题。

我有一个搜索框,

HTML

<input type="text" id="search" placeholder="Search" autocomplete="off"/>

当我在搜索框中键入任何内容时,例如abc,我需要在下拉列表中显示,匹配'abc'的restaurents,这是在前端完成的。

以下是我为获取数据而编写的代码,

JS

$("#search").keyup(function(){
    if ($(this).val().length == 3) {
        console.log($(this).closest(".row-fluid").find("ul").attr('id'));
        $(this).closest(".row-fluid").find("ul").css('display', 'none');
    }
}).autocomplete({
    source: function(request, response) {
        $.ajax({
            type: "POST",
            url: "/search/site_search/"+$('#search').val(),
            dataType: "json",
            success: function(data) {
            response( $.map( data.result, function( item ) {
                return {
                    label: item.complaint_title,
                    value: item.complaint_iid,
                };
            }));
        },
        error: function(result) {
            alert("Error");
        }
        });
    },
    select: function (event, ui) {
        console.log(ui.item);
    },
    focus: function( event, ui ) {
        $( "#search" ).val( ui.item.label );
        return false;
    }
}).data( "ui-autocomplete" )._renderItem = function( ul, item ) {
    return $( "<li>" )
        .data( "ui-autocomplete-item", item )
        .append( "<a>" + item.label + "</a>" )
        .appendTo( ul );
};

有谁能告诉我怎么做。

0 个答案:

没有答案