js虚拟数字小键盘

<div id="inputContainer">
  <input type="text" id="numberInput" readonly />
  <button onclick="showKeyboard()">输入数字</button>
</div>
<div id="keyboard" style="display: none;">
  <button onclick="addNumber('1')">1</button>
  <button onclick="addNumber('2')">2</button>
  <!-- 其他数字按钮 -->
  <button onclick="hideKeyboard()">完成</button>
</div>

function showKeyboard() {
  document.getElementById('keyboard').style.display = 'block';
}

function hideKeyboard() {
  document.getElementById('keyboard').style.display = 'none';
}

function addNumber(num) {
  const input = document.getElementById('numberInput');
  input.value += num;
}

#keyboard button {
  width: 50px;
  height: 50px;
}