jquery - 如何获取触发 jQuery 自动完成小部件的输入元素？

Question

我有几个使用 jQuery 自动完成功能增强的输入字段。触发select事件时如何获取对应的输入框？

<input name="1" value="">
<input name="2" value="">
<input name="3" value="">

$('input[type=text]').autocomplete({
    source: 'suggestions.php',
    select: function(event, ui) {
        // here I need the input element that have triggered the event
    }
});

Answer 1

我为source参数使用了一个匿名函数，并且$(this)在其中引用了函数，而不是触发它的元素。我不得不使用$(this.element).

最终代码与此类似（我出于演示目的对其进行了简化）：

$( ".regionsAutocomplete" ).autocomplete({
    source: function(request, response){

        //The next line is the important one for this example
        var input = this.element;
        $(input).css('color','red');

        var data = {'foo':'bar'};
        $.ajax({
            'url': ajaxurl,
            'data': data,
            'method': "POST",
            'dataType': "json",
            'success': function(data) {
                response(data);
            }
        });
    }
});

Answer 2

尝试使用$(this)

$('input[type=text]').autocomplete({
    source: 'suggestions.php',
    select: function(event, ui) {
        // here I need the input element that have triggered the event
        alert($(this).attr('name'));
    }
});

Answer 3

您可以使用$(this)或event.target。

然后您可以使用$(this).prop('name')or获取名称event.target.name。

演示

Answer 4

据我所知，您不需要$(). this会工作得很好，因为 name 是一个定义的属性。

this.name

Answer 5

采用$(this)

 select: function(event, ui) {
        $(this).attr('name');
    }