javascript - 无法获取自动完成字段值

Question

我有自动完成字段

$('.airport_field_destination').on('autocompleteselect', (event, ui) => {
  var id = Number($(this).attr('data-number'))

  $(`#search_legs_${id + 1}_origin_text`).val(ui.item.value);
  $(`#search_legs_${id + 1}_origin_id`).val(ui.item.id)
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="search[legs][0][destination_text]" id="search_legs_0_destination_text" value="London (LON), England" class="field-3 airport_field airport_field_destination ui-autocomplete-input" data-number="0" placeholder="Till" data-source="/autocomplete/destination/flight"
  data-id-element="#search_legs_0_destination_id" autocomplete="off">

但是 var id 对我说 NaN

我的问题在哪里？

更新

使用 event.target 我可以得到 id。但是 ui.item.value 显示未定义

Answer 1

this 事件未定义，因为箭头函数不捕获上下文(它使用外部 this 上下文)。如果您使用 function(event, ui) { ... } 事件处理程序语法，那么您将获得正确的 this。

否则，如果您想获得正确的元素，您可以使用 event.target 作为 this 的替代方法，正如@GeorgeBailey 所建议的那样。