Question

我只想在我的自动提示框中获得5个结果，并且不知道我该怎么做。任何帮助将不胜感激继承我的代码：

<div class="input-wrapper">
    <input type="text" class="autosuggest" value="Type in a city or town" onblur="onBlur(this)" onfocus="onFocus(this)" >
    <input type="submit" value="Search">

    <div class="dropdown">
        <ul class="result"></ul>
    </div>
</div>

并且继承我的剧本：

$(document).ready(function() {
    $('.autosuggest').keyup(function() {
        var search_term = $(this).attr('value');
        $.post('php/search.php', { search_term: search_term }, function(data) {
            $('.result').html(data);
            $('.result li').click(function(){
                var result_value = $(this).text();
                $('.autosuggest').attr('value', result_value);
                $('.result').html('');
            });
        });
    });
});
function onBlur(el) { 
    if (el.value == '') { 
        el.value = el.defaultValue; 
    } 
} 
function onFocus(el) { 
    if (el.value == el.defaultValue) { 
        el.value = ''; 
    } 
}

Answer 1

最佳解决方案是在服务器上执行此操作。但是，由于某种原因，如果在服务器上无法实现，您可以尝试在JS中使用。在这里，我希望服务器以下列格式返回数据'＆lt; li＆gt; data＆lt; / li＆gt;'。

$('.autosuggest').keyup(function() {
    var search_term = $(this).attr('value');

    $.post('php/search.php', { search_term: search_term }, function(data) {
        //Edit Start
        var dataarr=data.split('<li>');
        var totalrow=(dataarr.length>5)?5:dataarrr.length;
        $('.result').html('');
        for(var i=1;i<=totalrow;i++){//neglectine first data as it will be blank
             $('.result').html( $('.result').html('')+'<li>'+dataarr[i]);
        }
        //Edit end

        $('.result li').click(function(){
            var result_value = $(this).text();
            $('.autosuggest').attr('value', result_value);
            $('.result').html('');

        });
    });

});

Answer 2

将搜索结果限制在search.php文件（php / search.php）中。你可以这样做;

$fetch = mysql_query("SELECT * FROM table LIMIT 5")

如何将自动提示结果限制为5个结果

2 个答案: