无法通过 JavaScript 模拟用户点击 HTML SELECT 控件

Question

我正在尝试编写一个简单的 JavaScript 代码（通过 Chrome 扩展注入页面），它将打开 HTML [=25] 的选项列表=]控件（供交互用户查看），于是想着模拟用户点击控件。我可以通过 JavaScript 在 BUTTON 上触发点击事件，但 SELECT 控件拒绝我的尝试。

function triggerClick(domElmId) {
    let domElm = document.getElementById(domElmId);
    triggerEvent(domElm, 'mouseover');
    triggerEvent(domElm, 'mousedown');
    triggerEvent(domElm, 'click');
    triggerEvent(domElm, 'mouseup');  
}
function triggerEvent(domElm, eventName) {
    let options = {pointerX: 0, pointerY: 0, button: 0, ctrlKey: false, altKey: false, shiftKey: false, metaKey: false, bubbles: true, cancelable: true};
    let eventType = 'MouseEvents';
    let oEvent = null;
    oEvent = new MouseEvent(eventName, options);
    domElm.dispatchEvent(oEvent);
}

代码示例：https://codepen.io/anon/pen/mBegaq

有什么想法吗？

Answer 1

浏览器不允许在 javascript 中扩展 <select>。然后只能用鼠标点击展开

但是，如果你真的需要这样做。有解决办法：https://code.google.com/archive/p/expandselect/

这需要创建另一个 <select>，同时显示多个选项。然后将其定位在旧控件上。

或者，看看这个问题以获得一些想法：Is it possible to use JS to open an HTML select to show its option list?

无法通过 JavaScript 模拟用户点击 HTML SELECT 控件

Unable to simulate a user click on an HTML SELECT control via JavaScript

html

javascript

events

controls

triggers