如何使用Javascript使用表单输入自动填充小部件？

document.getElementById('inputField').addEventListener('input', autoComplete);

function autoComplete(event) {
  var userInput = event.target.value;
  // 进行处理...
}

function autoComplete(event) {
  var userInput = event.target.value;
  // 获取匹配的建议或自动填充的内容
  var suggestions = getSuggestions(userInput);

  // 清空现有的建议列表
  clearSuggestions();

  // 创建新的下拉列表元素
  var dropdown = document.createElement('ul');
  dropdown.setAttribute('id', 'suggestionList');

  // 将建议的选项添加到下拉列表中
  suggestions.forEach(function(suggestion) {
    var listItem = document.createElement('li');
    listItem.textContent = suggestion;
    dropdown.appendChild(listItem);
  });

  // 将下拉列表添加到页面中
  document.getElementById('suggestionContainer').appendChild(dropdown);
}

function autoComplete(event) {
  // ...

  // 为建议的选项添加点击事件监听器
  dropdown.addEventListener('click', function(event) {
    // 将选中的建议填充到输入框中
    document.getElementById('inputField').value = event.target.textContent;

    // 清空建议列表
    clearSuggestions();
  });
}