如何将下拉框onchange获取的选中值赋值给预定义JS对象

你只需要将onchange事件回调中原来打印值的逻辑，替换为对stack对象对应属性的赋值操作即可，注意要保证stack变量定义在事件回调可访问的作用域范围内。

修改后完整代码 #

// 预定义目标对象
let stack = {
  pinecones: null,
  kindling: null,
  logs: null
};

// 下拉框change事件逻辑
pinecones.onchange = function(e) {
  // 原有取值逻辑可保留，也可以简化为 let value = pinecones.value; 效果完全一致
  let value = pinecones.options[pinecones.selectedIndex].value;
  // 将获取到的选中值赋值给stack的pinecones属性
  stack.pinecones = value;
}

可选优化点 #

• 下拉选择框原生支持直接通过.value属性获取当前选中项的值，不需要通过selectedIndex中转，取值逻辑可以简化为const selectedValue = pinecones.value;
• 如果你需要页面初始加载时就把下拉框的默认选中值同步到stack对象，不需要重复写取值逻辑，只需要在事件绑定完成后手动触发一次change事件即可：

// 绑定完事件后追加这行，初始化时自动同步默认值
pinecones.dispatchEvent(new Event('change'));

内容的提问来源于stack exchange，提问作者Allie Pallie