<button id="dropdown-button">点击我</button>
<div id="dropdown" style="display: none;">
  <!-- 下拉框内容 -->
  <ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
  </ul>
</div>
// 获取按钮和下拉框元素
var button = document.getElementById('dropdown-button');
var dropdown = document.getElementById('dropdown');

// 点击按钮时显示下拉框
button.addEventListener('click', function () {
  dropdown.style.display = 'block';
});

// 点击下拉框区域之外的任何地方时隐藏下拉框
document.addEventListener('click', function (event) {
  if (!dropdown.contains(event.target) && event.target !== button) {
    dropdown.style.display = 'none';
  }
});
Last Updated:
Contributors: pengrengui