如何在json文件中使用jQuery自动完成功能？

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

<input type="text" id="searchInput" />
<div id="autocompleteResults"></div>

$(document).ready(function() {
  // 监听输入框的键盘输入事件
  $('#searchInput').keyup(function() {
    var searchText = $(this).val(); // 获取输入框的值

    // 发送Ajax请求获取json数据
    $.getJSON('data.json', function(data) {
      var results = []; // 存储匹配的结果

      // 遍历json数据，查找匹配的项
      $.each(data, function(key, value) {
        if (value.toLowerCase().indexOf(searchText.toLowerCase()) !== -1) {
          results.push(value); // 将匹配的项添加到结果数组中
        }
      });

      // 清空自动完成结果区域
      $('#autocompleteResults').empty();

      // 将匹配的结果显示在自动完成结果区域
      $.each(results, function(index, result) {
        $('#autocompleteResults').append('<div>' + result + '</div>');
      });
    });
  });
});