如何将ListBox对象放置在文本光标位置

// 获取文本光标位置
function getCaretPosition() {
  let position = 0;
  const input = document.getElementById("myInput"); // 假设输入框的id为"myInput"
  if (input.selectionStart || input.selectionStart === 0) {
    position = input.selectionStart;
  }
  return position;
}

// 创建并配置ListBox对象
function createListBox() {
  const listBox = document.createElement("select");
  listBox.id = "myListBox"; // 设置ListBox的id
  // 设置ListBox的其他属性和数据源
  // ...
  return listBox;
}

// 定位ListBox对象
function positionListBox() {
  const input = document.getElementById("myInput"); // 假设输入框的id为"myInput"
  const listBox = document.getElementById("myListBox"); // 假设ListBox的id为"myListBox"
  const caretPosition = getCaretPosition();
  const inputRect = input.getBoundingClientRect();
  listBox.style.position = "absolute";
  listBox.style.left = inputRect.left + "px";
  listBox.style.top = inputRect.top + caretPosition + "px";
}

// 显示ListBox对象
function showListBox() {
  const listBox = document.getElementById("myListBox"); // 假设ListBox的id为"myListBox"
  document.body.appendChild(listBox);
}

// 调用以上函数，实现将ListBox对象放置在文本光标位置
positionListBox();
showListBox();