Не могу получить $ (это), работающее в автозаполнении jQueryUI - PullRequest
Новая
       20

Не могу получить $ (это), работающее в автозаполнении jQueryUI

30 голосов
/ 28 ноября 2010

Я пытаюсь создать общий сценарий автозаполнения, используя jQueryUI. Автозаполнение должно работать для каждого: 

<input type='text' class='autocomplete' id='foo'/>
<input type='text' class='autocomplete' id='bar'/>
...

Теперь я пытаюсь получить доступ к 'foo' или 'bar' в исходной функции, используя $ (this), но при предупреждении я всегда получаю 'undefined'. 

$('input.autocomplete').autocomplete({
    source: function(req, add){
        var id = $(this).attr('id');
        alert(id);
    }
});

Что я делаю не так?

Ответы [ 4 ]

57 голосов
/ 29 ноября 2010

Настройка автозаполнения отдельно для каждого элемента в вашем выборе, используя закрытие для хранения ссылки на соответствующий элемент.Примерно так: 

$('input.autocomplete').each(function(i, el) {
    el = $(el);
    el.autocomplete({
        source: function(req, add) {
            var id = el.attr('id');
            alert(id);
        }
    });
});

Альтернатива (правка)

Я не понимаю, почему существует такое сопротивление использованию each(): этоработает, код очень понятный и читаемый, и он не создает проблем с эффективностью;но если вы решили избежать each(), вот альтернатива ...

* ПОЖАЛУЙСТА, ОБРАТИТЕ ВНИМАНИЕ: следующий подход опирается (немного) на внутренние компоненты jQuery Autocomplete, поэтому я рекомендуюпервый вариант ... но выбор за вами. 

$('input.autocomplete').autocomplete({
        source: function(req, add) {
            var id = this.element.attr('id');
            alert(id);
        }
    });
});

Это будет работать, по крайней мере, до тех пор, пока они не изменят способ вызова функции source() из плагина autocomplete.

Итак, у вас есть два варианта ... что-то для всех.

2 голосов
/ 07 мая 2014

Чтобы получить доступ к этому элементу ввода, вы должны быть в состоянии сделать следующее: 

$(this.element).val();

Конечно, это просто получает значение.Вы можете получить доступ к другим атрибутам следующим образом: 

$(this.element).attr('value'); // just another way to get the value
$(this.element).attr('id');

Кроме того, предположим, что вы хотите получить доступ к этому элементу в событии выбора , вы можете сделать это следующим образом: 

$(event.target).attr('value');
$(event.target).attr('id');
0 голосов
/ 29 ноября 2010

Марвелин правильный.«this» будет ссылаться на вновь созданную функцию, в которую вы вложили.Это легко исправить, создав переменную id вне функции и используя ее внутри функции.

0 голосов
/ 28 ноября 2010

$(this) придет из вашей недавно созданной функции и, следовательно, не будет работать. Переместите ваше объявление id выше source, и оно должно работать.

...