php – 在输入字段中输入字符后自动建议？

这可能不是最好的解决方案,但它适用于我的网站.此脚本实现街道名称自动完成,这取决于用户之前输入的州和城市.这段特殊的代码监听事件“keyup”.如果用户输入了多个字母,脚本将启动ajax请求,其中.php脚本分析我们发送的参数,进行SQL查询和回复.如果用户足够幸运并且他对他试图找到的街道名称有一些建议,我们会向他展示id = hintsTable的div.我们还为每个自动完成选项创建事件监听器(单击),在该选项中,我们从auto complete选项中替换输入字段的值,并隐藏下拉列表.
我希望它有所帮助.

$("#street input").keyup(function(){                                                    //street enter
        var input = $('#street input').val(); //we get what user has already entered
        var code = $('#mregionSelect').val(); //city id
        if(input.length > 1)
        {
            $.ajax({
                type        : "POST",url         : "components/com_areas/ajaxhelper.php",data        : "input=" + encodeURIComponent(input) + "&code=" + code,cache       : false,}).done(function(msg){
                if(msg.length > 0)
                {
                    $('#hintsTable').html(msg); //fill drop-down list with auto complete options
                    $('#hints').css('display','block'); //show the list
                    $('#hintsTable tr').click(function(){
                        var hint = this.cells[0].innerHTML;
                        $('#street input').val(hint);
                        $('#hints').css("display","none");
                    })
                }
                else
                {
                    $('#hintsTable').html('');
                    $('#hints').css('display','none');
                    //$('#findButton').css('display','none');
                }
            })
        }
        else
        {
            $('#hintsTable').html('');
            $('#hints').css('display','none');
            //$('#findButton').css('display','none');
        }               
    })