Как я могу обратиться к полю ввода при использовании автозаполнения пользовательского интерфейса jQuery?

Question

У меня есть форма со многими входами, все они с классом "поле". В моем файле JavaScript у меня есть что-то вроде этого:

$(".field").autocomplete({
    source:"search.php",
    select:function(event,ui){$(???).doStuff();}
    });

Мне нужен какой-то способ ссылки на поле ввода, в котором пользователь пишет (то есть какой-то селектор вместо «???»), чтобы я мог что-то делать с окружающими элементами. Я предполагаю, что ответ - что-то вроде «ui.field», «ui.input» или «ui.element», но я попробовал те и другие без удачи, и я не смог найти ответ ни в документации, ни здесь так что я обращаюсь к вам. Спасибо!

Answer 1

Это this (это необработанный элемент, а не оболочка), как и в большинстве событий jQuery Это может быть задокументировано лучше. :-) Так в вашем случае:

$(".field").autocomplete({
    source:"search.php",
    select:function(event,ui){
        // Here, `this` is the raw DOM element of the field
        $(this).doStuff();
    }
});

Пример ( живая копия ):

HTML:

<p>Type a <kbd>t</kbd> then pick a choice. The field will turn green briefly.</p>
<input class="ac" type="text">
<input class="ac" type="text">
<input class="ac" type="text">

JavaScript:

jQuery(function($) {
  $(".ac").autocomplete({
    source: ["two", "three", "thirty"],
    select: function(event, ui) {
      var $this = $(this);
      $this.css("color", "green");
      setTimeout(function() {
        $this.css("color", "");
      }, 500);
    }
  });
});

Answer 2

Я почти уверен, что this.id справится с этой задачей.

$(".field").autocomplete({
source:"search.php",
select:function(event,ui){$("#" + this.id).doStuff();}
});

Answer 3

Вы пробовали ui.item (ui.item.value, ui.item.id и т. Д.)?