Simuler le click d'un bouton en injectant des coordonnées dans une fonction

**patricktoulon** · 22/03/2016, 19h23

Bonjour a tous
je cherche le moyen de cliquer n'importe ou dans le body et que ca me renvoie le nom ou id du bouton qui se trouve dans les coordonnées x y
j'ai trouver cela dans la faq et un peu partout
mais je ne sais pas comment le faire fonctionner
dans cet exemple j'ai deux bouton
le bouton a cliquer et le bouton qui appelle la fonction pour cliquer sur le premier en injectant des coordonnées

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<!doctype html>
<html>
<head>
<script>
function evenement(xx,yy){
oEvent = document.createEvent( "MouseEvents" );
oEvent.initMouseEvent(
  "click",    // le type d'événement souris
  true,       // est-ce que l'événement doit se propager (bubbling) ?
  true,       // est-ce que le défaut pour cet événement peut être annulé ?
  window,     // l' 'AbstractView' pour cet événement
  1,          // details -- Pour les événements click, le nombre de clicks
  1,          // screenX
  yy,          // screenY
  xx,          // clientX
  1,          // clientY
  false,      // est-ce que la touche Ctrl est pressée ?
  false,      // est-ce que la touche Alt est pressée ?
  false,      // est-ce que la touche Shift est pressée ?
  false,      // est-ce que la touche Meta est pressée ?
  0,          // quel est le bouton pressé
  target      // l'élément source de cet événement
);
//target.dispatchEvent( oEvent );
target.fireEvent( "onclick" );
}
</script>
</head>
<body style="margin-left:0;padding-top:0;border:1px solid red;">
<button onclick="alert('Clicked')" id="btn">vrai bouton</button>
<button style ="position:absolute;top; 500;" onclick="evenement(10,23)" id="btn2">clique sur le vrai  bouton</button>
<script>
evenement ("btn");
</script>
</body>
</html>

si quelqu'un a une idée je suis preneur
tout ce qui compte c'est le fait que le bouton est inconnu(plusieurs bouton ajouter dynamiquement DOM) seules les coordonnées doivent donner ou non un bouton cliqué

ps: pour Ie 9 a IE 11

**Beginner.** · 23/03/2016, 22h14

Salut,

Dans ce fil Cliquer sur une position X Y il y a une réponse au sujet d'une fonction...

J'ai testé ici : http://jsbin.com/nozuhakuza/edit?html,output en utilisant :

onclick="document.elementFromPoint(10, 23).click();"

Avec Firefox et IE 8 ça marche apparemment...

**patricktoulon** · 23/03/2016, 22h26

Bonsoir beginner je te remercie pour ta réponse
je connaissais pas cet api je vais essayer avec IE car la destination de cet exercice est un composant Webbrowser.ocx dans VB utilisant les librairie IE9

je reviens après test
merci a toi

**Beginner.** · 23/03/2016, 22h31

De rien ! J'ai aussi testé IE 8 (je n'ai pas la version 9) et ça marche aussi...

**patricktoulon** · 23/03/2016, 23h05

re
c'est bien ce que je pensais ca fonctionne pas vraiment
tiens teste ce code tu verra j'ai ajouté le message et des div
en fait tout se met en vert
et en plus mes div se placent pas comme il faut !

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<html>
<head>
<title>Exemple d'utilisation d'elementFromPoint</title>
<script type="text/javascript">
function changeColor2(newColor)
{
 elem = document.elementFromPoint(600,2);
 elem.style.color = newColor;
alert(elem.id)
}
</script>
</head>
<body style="width100%;height:100%">
<p id="para1">Un peu de texte ici</p>
<div id="div1" style="postion:'absolute';left:200px,top:150px;width:50px;height:40px;border:1px solid red;float:left"> div1</div>
<div id="div1" style="postion:absolute;left:300px,top:80px;width:50px;height:40px;border:1px solid red;float:left"> div1</div>
<div id="div1" style="postion:absolute;left:500px,top:250px;width:50px;height:40px;border:1px solid red;float:left"> div1</div>
<div id="div1" style="postion:absolute;left:600px,top:350px;width:50px;height:40px;border:1px solid red;float:left"> div1</div>
<p id="para1">encore un peu de texte ici</p>
<p id="para1">encore un peu de texte ici</p>
<p id="para1">encore un peu de texte ici</p>
</br>
<button onclick="changeColor2('green');">vert</button>
</body>
</html>

**Beginner.** · 23/03/2016, 23h29

J'ai testé et ça marche, regarde ici : http://jsbin.com/jovunetage/edit?html,console,output

Seul le texte de la troisième div passe au vert...

Alors le problème c'est les coordonnées, à (600,2) cela renvoi un élément nul donc ça foire... mais à 127,55 c'est bon.

J'ai ajouté l'affichage des coordonnées pour voir...

J'ai vu sur site qu'avec IE les coordonnées fonctionnent pas pareil, je vais chercher le lien ...

Simuler le click d'un bouton en injectant des coordonnées dans une fonction

JavaScript

Vue hybride

Discussions similaires

Partager

Partager