Select 第一个字段来自 jQuery 自动完成 function 自动完成

Question

当我将鼠标悬停在自动完成列表中的一个字段上时，它会添加一个名为 selected 的 class。 我希望它在您开始输入时默认在第一行执行此操作。 我将如何将 select 作为该列表中的第一个元素并将其更改为 class？

我现在正在使用它，但它闪烁很多。

$('.name').eq(0).addClass('selected');

Answer 1

您可能需要为此使用 jQuery 的toggleClass()和first() 。

$('.name').first().toggleClass('selected');

Answer 2

我打赌闪烁是由于在每个 keyup 事件上调用它引起的。 您需要“去抖动” function 调用。

使用 jQuery 去抖动功能：

http://benalman.com/projects/jquery-throttle-debounce-plugin/

像这样：

$('input:text').keyup( $.debounce( 250, function() {
  // run autocomplete routine / ajax call here
  $('.name').eq(0).addClass('selected');
}) );

当然，这需要一个 jQuery 插件，所以如果您想要一个占用空间最小的版本，请使用John Hann的纯 JavaScript 版本：

使用纯 Javascript 和更少代码的去抖动函数：

或者，如果您不想使用其他插件，去抖很简单：

var debounce = function (func, threshold, execAsap) {

  var timeout;

  return function debounced () {
    var obj = this, args = arguments;
    function delayed () {
        if (!execAsap)
            func.apply(obj, args);
        timeout = null; 
    };

    if (timeout)
        clearTimeout(timeout);
    else if (execAsap)
        func.apply(obj, args);

    timeout = setTimeout(delayed, threshold || 100); 
  };
};

用法：

$('input:text').keyup( debounce(function() {
  // run autocomplete routine / ajax call here
  $('.name').eq(0).addClass('selected');
}), 250, false );