jquery搜索autosuggest非常慢

时间:2014-01-24 10:17:23

标签: jquery

我有autosuggest搜索字段,但结果加载速度非常慢,我认为这可能是我的错误。请看一下代码并建议我:)

我有大约1000个结果的数据库表(因此不多)。 也许应该停止搜索进入新的charcter,或者...... 提前感谢您的建议。

<div class="searching">
<form id="search" name="searchForm" class="sform" action="index" method="post" autocomplete="off">
    <input type="text" name="keywords" id="inputString"  class="searches"  />
    <input type="submit" name="submit_btn" class="button"  />
</form>

<div class="results">
    <div class="inner">
        <?php //print_r($_POST);
        if(isset($_POST['results']) && !empty($_POST['results'])){
            ?>
            <ul>
            <?php
            foreach($_POST['results'] as $row){
                echo $_POST['results'];
            }
            ?>
            </ul>
            <?php
        }
        ?>
    </div>
</div>
</div>
//tried to use suggestion I found here - with set timeout
$("#inputString").keyup(function(e){
    clearTimeout($.data(this, 'timer'));
    if (e.keyCode == 13)
      search(true);
    else
      $(this).data('timer', setTimeout(search, 100));
    e.preventDefault();
});      

function search(force) {
    var existingString = $("#inputString").val();
    if (!force && existingString.length < 1) return; 
    $('.res_items').slideDown('normal');
        dataString = $("#search").serialize();
        $.ajax({
            type:"POST",
            data:dataString,
            url: searchsuggest.php',

            success:function(data){

                if(data.success == 'yes'){
                    $('.res_items').show().load(' .inner_slide', {results:data.items});
                }
            },
            error: console.log('error')
        });
}

and then in ajax part I have a query with LIKE - which gives slower results

SELECT id, items FROM games WHERE itmes LIKE '".trim($_POST['keywords'])."%'" 
and output json data: 
$arr = array('success' => "yes", 'items' => $find_items);
header('Content-type: application/json');    
echo json_encode($arr);   

1 个答案:

答案 0 :(得分:3)

你的jQuery或php代码中没什么可做的。我认为一种可能的解决方案是将您的SQL查询限制为前50/100 结果。我认为这可能足以作为建议显示出来。

每个请求传输大量数据会非常耗费大量时间(这就是为什么建议在数据网格上进行分页)然后将这些数据写入html页面也会花费一些时间。 您也可以尝试索引SQL表(如果它还没有)