选择一个下拉列表时，我想将其他下拉列表更改为未选中

<select id="dropdown1">
  <option value="option1">Option 1</option>
  <option value="option2">Option 2</option>
  <option value="option3">Option 3</option>
</select>

<select id="dropdown2">
  <option value="option1">Option 1</option>
  <option value="option2">Option 2</option>
  <option value="option3">Option 3</option>
</select>

<select id="dropdown3">
  <option value="option1">Option 1</option>
  <option value="option2">Option 2</option>
  <option value="option3">Option 3</option>
</select>

// 获取所有下拉列表的元素对象
var dropdowns = document.querySelectorAll('select');

// 给每个下拉列表添加选择事件的监听器
dropdowns.forEach(function(dropdown) {
  dropdown.addEventListener('change', function() {
    var selectedId = this.id; // 获取当前选择的下拉列表的ID

    // 遍历所有下拉列表的元素对象数组
    dropdowns.forEach(function(dropdown) {
      if (dropdown.id !== selectedId) {
        dropdown.selectedIndex = 0; // 将其他下拉列表的选中状态修改为未选中
      }
    });
  });
});