jQuery Автозаполнение и при изменении проблемы - PullRequest
Новая
       13

jQuery Автозаполнение и при изменении проблемы

2 голосов
/ 15 февраля 2011

У меня есть текстовое поле с текстом идентификатора ("#text") с автозаполнением, подобным этому: 

$("#text").autocomplete(data);

это прекрасно работает.Теперь я хочу три вещи:

a) Если пользователь нажимает на опцию автозаполнения -> поиск для этого

b) Если пользователь что-то печатает, отображается действие автозаполнения, но он щелкает где-тоelse -> поиск строки, которую он набрал

c) Если пользователь вводит что-то, что должно быть автозаполнено, и щелкает где-то еще (изменить событие) -> поиск строки, которую он набрал

Звучит простодля меня, но я не могу заставить его работать.В данный момент у меня есть что-то вроде этого: 

$("#text").result(function(e) {
    $("#text").trigger("change");
});
$("#text").change(function(e){
    $(".x").load(...);  
});

Если я не использую этот триггер, то а) не работает вообще, если я набираю «а» и нажимаю на опцию автозаполнения, «#text"содержит" a "в функции изменения.Таким образом, изменение срабатывает до изменения значения.Я думаю, что это не будет проблемой, так как вскоре после этого результат снова запускает триггер с правильным значением, но этого не происходит.

Подобным образом это иногда работает, но не всегда.Я много чего пробовал, и некоторые работали лучше, а некоторые хуже, но все время ничего не получалось.Как мне сделать это правильно?

1 Ответ

2 голосов
/ 15 февраля 2011

Я никогда не работал с используемым вами автозаполнением, но вот инструмент, который вы должны включить в свой инструментарий решения проблем JavaScript.

Когда событие запускается непосредственно перед другим событием, и вам нужнодождитесь завершения второго события перед обработкой первого, используйте setTimeout(...).Временами кажется, что требуется задержка, но чаще всего вам просто нужно несколько вложенных вызовов для setTimeout (..., 0) 

function onIdle(fn, loops) {
  loops = loops == null ? 1 : loops;
  if (loops > 0) {
    setTimeout(function() { onIdle(fn, loops - 1); }, 0);
  } else {
    fn();
  }
}

С помощью приведенного выше кода вы можетесделайте что-то подобное в вашем обработчике onChange: 

onIdle(function() { ... }, 5);

Это вызовет setTimeout последовательно, 5 раз.В пятый раз (после которого другое событие должно было завершиться) вы можете обработать изменение и использовать новое значение.

...