addEventListener在Google Chrome中绑定点击事件不生效求助

你当前代码失效的核心原因是给<option>标签绑定click事件的写法不符合Web标准：

• 仅Firefox浏览器单独做了兼容，支持响应<option>元素上的click事件
• Chrome、Edge、Safari等Chromium/WebKit内核浏览器，都不会触发<option>元素上绑定的click事件，也不会抛出相关错误

这个问题和你是否将JS作为外部文件引入、是否使用window.addEventListener绑定事件没有任何关系，这也是你之前尝试的方案全部无效的原因。

不要给单个<option>元素绑定事件，直接监听父级<select>元素的change事件即可——用户选中下拉选项时会立即触发该事件，所有主流浏览器都完美支持，性能也比遍历绑定所有option更好。
你的HTML代码不需要做任何调整，直接替换JS代码为以下内容即可：

const selectDom = document.getElementById('selections');
selectDom.addEventListener('change', function() {
    // 获取当前选中项的文本内容，和你原代码中取innerHTML的逻辑一致
    const selectedPlanName = this.options[this.selectedIndex].textContent;
    console.log(selectedPlanName);
    retrieveplans(selectedPlanName);

    // 如果你需要获取选中项的value属性（比如plan1/plan2），直接用this.value即可获取
    // const selectedPlanValue = this.value;
})

原生下拉选择控件的事件派发逻辑是：用户点击展开下拉、点击选项的交互事件，默认都是绑定在<select>元素上的，浏览器不会把点击事件派发给内部的<option>子元素，不要在option元素上绑定鼠标、点击类交互事件。

内容的提问来源于stack exchange，提问作者Vaibhav Vishwakarma