StackOverflow中标记的AutoSuggest功能如何避免在每个键击中查询

Question

我正在尝试使用Jquery为本网站文本区域下方的标签实现类似autosuggest功能的类似功能.我试图弄清楚在几次击键后如何发送请求,而不是在每次击键后发送.我正在使用'keyup'事件来触发我的应用程序上的请求.我意识到这可能会导致服务器命中次数过多,并可能影响性能.

如果有人可以解释我如何通过不在每个keyup上运行查询来实现stackOverflow所做的事情,这将是非常棒的.

Answer 1

我的一个Windows应用程序中有类似的功能.当用户键入字符时,以1秒的间隔启动计时器.在Tick事件中,搜索开始.如果用户再次键入,则重新启动计时器.因此,仅在键盘空闲超过一秒钟时才执行搜索.

简短的样本(它在C#中,但很容易遵循):

public partial class Form1 : Form
{
    private System.Windows.Forms.Timer timer = new System.Windows.Forms.Timer();

    public Form1()
    {
        InitializeComponent();

        timer.Interval = 1000;
        timer.Tick += new EventHandler(timer_Tick);
    }

    void timer_Tick(object sender, EventArgs e)
    {
        timer.Stop();

        // Do search, or what ever you want to do
        Console.WriteLine("Searching...");
    }

    private void textBox1_KeyDown(object sender, KeyEventArgs e)
    {
        if (timer.Enabled)
        {
            timer.Stop();
        }

        timer.Start();
    }
}

我没有Javascript的经验,但是从这里开始的anwswer 会帮助你我想:

<input name="domain" type="text" id="domain" onKeyUp="javascript:chk_me();">

var timer;
    function chk_me(){

       clearTimeout(timer);
       timer=setTimeout(function validate(){...},1000);
    }