js列表框

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

<script>
  document.getElementById('singleSelect').addEventListener('change', function() {
    console.log('Selected:', this.value);
  });
</script>

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

<script>
  document.getElementById('multiSelect').addEventListener('change', function() {
    console.log('Selected:', Array.from(this.selectedOptions).map(option => option.value));
  });
</script>

// 添加选项
var select = document.getElementById('singleSelect');
var newOption = document.createElement('option');
newOption.text = 'New Option';
newOption.value = 'newOption';
select.add(newOption);

// 删除选项
select.remove(select.selectedIndex);

select {
  width: 200px;
  padding: 10px;
  font-size: 16px;
}