Question

我正在尝试在我的php网站上构建一个提供自动完成功能的搜索功能。我注意到很多人都在推荐jquery UI自动完成功能。但我在网上看了他们的例子，似乎需要很长时间来搜索他们的例子“鸟”数据库。我没有花时间分析样本代码，看看是否有办法加快速度。但我只是想我会想看看我应该采取哪些其他方式来完成同样的事情提前感谢您的时间！

Answer 1

jQuery UI的自动完成功能非常丰富且非常棒。如果您担心使用AJAX从数据库获取项目的速度，请考虑预先填充嵌入在页面上的相关信息的JSON数组的方法。然后它很接近即时（你只会在页面上有一堆膨胀）

http://jqueryui.com/autocomplete/#default

<head>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.8.2.js"></script>
    <script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>
    <link rel="stylesheet" href="/resources/demos/style.css" />
    <script>
    $(function() {
        var availableTags = [
            "ActionScript",
            "AppleScript",
            "Asp",
            "BASIC",
            "C",
            "C++",
            "Clojure",
            "COBOL",
            "ColdFusion",
            "Erlang",
            "Fortran",
            "Groovy",
            "Haskell",
            "Java",
            "JavaScript",
            "Lisp",
            "Perl",
            "PHP",
            "Python",
            "Ruby",
            "Scala",
            "Scheme"
        ];
        $( "#tags" ).autocomplete({
            source: availableTags
        });
    });
    </script>
</head>

就是说，AJAX可以调用页面，查询数据库和返回数据的速度完全取决于您的连接及其运行的服务器。 jQueryUI的自动完成非常快，我可以保证它

看看他们的文档，你会对这个库的灵活性感到惊讶。远程数据源示例如下所示：

<script>
$(function() {
    function log( message ) {
        $( "<div>" ).text( message ).prependTo( "#log" );
        $( "#log" ).scrollTop( 0 );
    }

    $( "#birds" ).autocomplete({
        source: "search.php",
        minLength: 2,
        select: function( event, ui ) {
            log( ui.item ?
                "Selected: " + ui.item.value + " aka " + ui.item.id :
                "Nothing selected, input was " + this.value );
        }
    });
});
</script>

Answer 2

在您的网站中构建自动完成/实时搜索功能时，您不妨考虑使用rockitsearch.com等服务。它是用于构建自动完成/搜索端口的免费Web服务。

自动完成搜索选项

2 个答案: