2017-09-18 4 views
0

J'essaye d'écrire un simple code JavaScript (injecté sur une page via une extension Chrome), qui ouvrira la liste d'options pour un contrôle HTML SELECT (pour l'utilisateur interactif à voir), j'ai donc pensé à simuler un utilisateur en cliquant sur le contrôle. Je suis capable de déclencher un événement click sur un bouton via JavaScript, mais le contrôle SELECT refuse mes tentatives.Impossible de simuler un utilisateur cliquer sur un contrôle HTML SELECT via JavaScript

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); 
} 

exemple de code: https://codepen.io/anon/pen/mBegaq

Toutes les idées?

Répondre

0

Les navigateurs ne permettent pas l'extension <select> en javascript. Alors peut seulement être développé en cliquant avec la souris.

Cependant, si vous avez vraiment besoin de faire cela. Il existe une solution: https://code.google.com/archive/p/expandselect/

Ceci fonctionne en créant un autre <select> avec plusieurs options toutes affichées à la fois. Ceci est ensuite positionné sur l'ancien contrôle.

Sinon, jetez un oeil à cette question quelques idées: Is it possible to use JS to open an HTML select to show its option list?

+0

Merci! Savez-vous si ce comportement est spécifique à un contrôle SELECT ou existe-t-il d'autres contrôles HTML similaires qui refusent les clics JS simulés? –

+0

Bonne question. Je ne suis pas trop sûr d'être honnête. 'select' est le seul que j'ai rencontré jusqu'ici – DNKROZ