JQueryのオートコンプリート機能で拡張された入力フィールドがいくつかあります。選択イベントがトリガーされたときに対応する入力フィールドを取得するにはどうすればよいですか?
<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
}
});
$(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'));
}
});
source
paramに無名関数を使用していましたが、その中の$(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);
}
});
}
});
この例で私が知る限り、$()
は必要ありません。 nameは定義済みの属性であるため、this
は問題なく機能します。
this.name
$(this)
を使用する
select: function(event, ui) {
$(this).attr('name');
}