Связать с jQuery пользовательского интерфейса, используя автозаполнение.жить()

Question

Связать с jQuery пользовательского интерфейса, используя автозаполнение.жить()

Я искал везде, но я не могу найти никакой помощи...

у меня есть некоторые текстовые поля, которые создаются динамически через JS, поэтому мне нужно привязать все их классы к автозаполнению. В результате мне нужно использовать новое .видео (опция).

в качестве примера, чтобы связать все элементы с классом .фу сейчас и будущее создал:

$('.foo').live('click', function(){

  alert('clicked');

});

он принимает (и ведет себя) так же, как .связывать.)( Однако я хочу привязать автозаполнение...

этот не работает:

$('.foo').live('autocomplete', function(event, ui){

  source: 'url.php' // (surpressed other arguments)

});

как я могу использовать .live () для привязки автозаполнения?

обновление

разобрался с багетной:

$(function(){

  $('.search').live('keyup.autocomplete', function(){

    $(this).autocomplete({

      source : 'url.php'

    });

  });

});

645 12

jQuery autocomplete binding

12 ответов:

Comments

Ничего не найдено.

Famver Tags · Accepted Answer · 2010-12-29 05:30:01

Если вы используете jquery.ui.autocomplete.js попробуйте это вместо
.bind("keydown.autocomplete") or .live("keydown.autocomplete")
если не использовать jquery.ui.autocomplete.js и посмотреть, если он будет работать

Если это не относится, я не знаю, как тебе помочь бро

Dan · Accepted Answer · 2012-11-01 02:29:32

функция автозаполнения jQuery UI автоматически добавляет класс "ui-autocomplete-input" к элементу. Я бы рекомендовал живую привязку элемента к фокусу без "ui-autocomplete-input" класс для предотвращения повторной привязки к каждому событию keydown в этом элементе.
$(".foo:not(.ui-autocomplete-input)").live("focus", function (event) {
    $(this).autocomplete(options);
});
Edit

мой ответ теперь устарел с jQuery 1.7, см. комментарий Натана Струца для использования с новым .on() синтаксис.

karim79 · Accepted Answer · 2010-12-29 05:42:50

просто добавить, вы можете использовать .livequery плагин для этого:
$('.foo').livequery(function() {

    // This will fire for each matched element.
    // It will also fire for any new elements added to the DOM.
    $(this).autocomplete(options);
});

Ollie P · Accepted Answer · 2013-07-26 15:13:13

чтобы получить автозаполнение работает при динамической загрузке для on() событие, используемое в jQuery > 1.7, используя синтаксис, который предоставляет Натан Струц в своем комментарии:
$(document).on('focus', '.my-field:not(.ui-autocomplete-input)', function (e) {
    $(this).autocomplete(options)
});
здесь .my-field является селектором для вашего элемента ввода автозаполнения.

Rehan Anis · Accepted Answer · 2011-07-07 23:23:48

.жить() не работает с фокусом. также клавиша вверх.автозаполнение не имеет никакого смысла. Вместо этого то, что я пробовал и работает это
 $(document).ready(function(){
$('.search').live('keyup' , function()
  { 
    $(this).autocomplete({ source : 'url.php' }); 
  });
})
это работает прекрасно.

ysth · Accepted Answer · 2010-12-29 05:27:55

вы не можете. .live () поддерживает только фактические события JavaScript, а не какие-либо пользовательские события. Это фундаментальное ограничение того, как .жить() работает.

arthurmarcels · Accepted Answer · 2012-10-07 13:28:55

вы можете попробовать использовать это:
$('.foo').live('focus.autocomplete', function() {
    $(this).autocomplete({...});
});

J.Money · Accepted Answer · 2013-02-28 21:55:14

после чтения и тестирования ответов всех остальных я обновил его для текущей версии JQuery и сделал несколько настроек.

проблема с использованием keydown в качестве события, которое вызывает .autocomplete() это то, что он не может автозаполнения для этой первой буквы, набранной. Использование фокуса-лучший выбор.

еще я заметил, что все данные решения приводят к .autocomplete() вызывается несколько раз. Если вы добавляете элемент динамически на страницу, которая не будет удален снова, событие должно быть запущено только один раз. Даже если элемент должен быть удален и добавлен снова, событие должно быть удалено, а затем добавлено обратно каждый раз, когда элемент удаляется или добавляется, чтобы фокусировка на поле снова не вызывала ненужного вызова .autocomplete() каждый раз.

мой окончательный код выглядит следующим образом:
$(document).on('focus.autocomplete', '#myAutocomplete', function(e){
    $(this).autocomplete(autocompleteOptions);
    $(document).off('focus.autocomplete', '#myAutocomplete');
});

Chandu · Accepted Answer · 2010-12-29 05:27:49

автозаполнение-это не событие, а функция, которая позволяет функцию автозаполнения для текстового поля.

поэтому, если вы можете изменить js, который создает текстовые поля динамически, чтобы обернуть элемент textbox в качестве объекта jquery и вызвать автозаполнение для этого объекта.

Andi · Accepted Answer · 2011-04-01 03:25:44

Я только что заметил, что вы отредактировали свой пост с этим ответом. Это было очевидно для меня, поэтому я публикую его ниже для других. Спасибо.
$(function() 
{
  $('.search').live('keyup.autocomplete', function()
  { 
    $(this).autocomplete({ source : 'url.php' }); 
  });
});

Nicklas · Accepted Answer · 2012-02-16 03:11:06

это работает для меня:

$(function() 
{
  $('.item_product').live('focus.autocomplete', function()
  { 

    $(this).autocomplete("/source.php/", {
        width: 550,
        matchContains: true,
        mustMatch: false,
        selectFirst: false,
    }); 

  });
});

Yoshua · Accepted Answer · 2017-06-13 19:41:28

вы можете просто поместить автозаполнение внутри input live event, например:
$('#input-element').live('input', function(){
  
$("#input-element").autocomplete(options);

});