Trigger jQuery et simulation keypress

**Turbulator** · 16/12/2011, 13h16

Bonjour

Je m'amuse un peu à essayer de faire une visionneuse de slides google docs.
Avec 2 boutons gauche droite, je souhaite passer à l'écran précédent/suivant.
Pour cela, lorsque que j'ai un clic sur un des boutons, je souhaite utiliser un trigger pour simuler l'appui sur une touche gauche/droite comme si c'était l'utilisateur qui l'avait fait.
Mais hélas, rien ne se passe ...

Voici mon code :

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
 
<html>
<head>
	<title>Slides viewer</title>
	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
 
	<script type="text/javascript">
		$(document).ready(function() {
			$("iframe").focus();
			$("#prev").click(function() {
				var press = jQuery.Event("keypress");
				press.which = 37;
				$("iframe").trigger(press);
			});
			$("#next").click(function() {
				var press = jQuery.Event("keypress");
				press.which = 39
				$("iframe").trigger(press);
			});	
		});
	</script>
</head>
<body>
	<input id="prev" type="button" value="<"/>
	<input id="next" type="button" value=">"/>
	<div id="slides">
 		<iframe src="https://docs.google.com/present/view?id=0AX5OB7HMRFTQZDR3czVwal8yMjdmdG0zOTljOQ"
 			width="100%" 
	 	    	height="100%" 
	 	    	scrolling="auto" 
	 	    	frameborder="0" 
	 	    	id="viewer" />
 	 </div>		    	
 </body>

Quelqu'un a t-il déjà essayé ce genre de manipulation avec les trigger de type keypress ?
Ou a une meilleure api js pour faire ce genre de chose ?
Merci

**Bovino** · 16/12/2011, 14h00

Il me semble que la propriété which est readonly...

**Turbulator** · 21/12/2011, 17h31

Merci de ta réponse mais apparemment la propriété which ne fonctionne pas pour les flèches, il faut que j'utilise keyCode. Par contre, which fonctionne pour les lettres. Les 2 étant bien en write (j'ai pu expérimenter quelques cas).

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
37
38
39
40
41
42
 
<html>
<head>
	<title>Slides viewer</title>
	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
 
	<script type="text/javascript">
		$(document).ready(function() {
			$("#slides").focus();
			$("#prev").click(function() {
				var press = jQuery.Event("keypress");
				press.which = 112;
				$("iframe").focus();
				$(document.documentElement).trigger(press);
			});
			$("#next").click(function() {
				var press = jQuery.Event("keypress");
				press.keyCode = 39;
				$("iframe").focus();
				$(document.documentElement).trigger(press);
			});
			$("iframe");
 
			$(document.documentElement).keypress(function (event) {
			  alert("keyCode="+event.keyCode);
			  alert("which="+event.which);	
			});
		});
	</script>
</head>
<body>
	<input id="prev" type="button" value="<"/>
	<input id="next" type="button" value=">"/>
	<div id="slides">
 		<iframe src="https://docs.google.com/present/view?id=0AX5OB7HMRFTQZDR3czVwal8yMjdmdG0zOTljOQ"
 			width="100%" 
	 	    	height="100%" 
	 	    	scrolling="auto" 
	 	    	frameborder="0" 
	 	    	id="viewer" />
 	 </div>		    	
 </body>

.
Là quand j'appuie sur les boutons, mon event est bien capturé (Je capture les evenement touche pressée uniquement pour les intercepter, pour mon vrai besoin il est inutile). Il me reste juste le problème d'envoyer l'event au bon endroit. J'ai essayé sur "frame" mais sans succès alors qu'en ayant mis le focus dessus, si j'appuie au clavier ça marche bien.

**Turbulator** · 22/12/2011, 10h55

Bon ben, je me répond à moi même.
La réponse est très simple : c'est pas possible.
En effet, JQuery ne permet pas de simuler complètement le clavier. Les triggers sont seulement destiné aux handler (comme keypress(...) ).
En revanche, les apis de Firefox permettent de s'en sortir avec du dispatchEvent. J'ai testé ça marche dans un text input même si j'arrive pas à le faire avaler avec mon iframe (mais ça c'est une autre histoire).

**Bovino** · 22/12/2011, 11h46

j'arrive pas à le faire avaler avec mon iframe

Si ton but est de lancer des événements dans une iframe, tu peux oublier tout de suite !
Renseigne-toi sur la Same Origin Policy.

Trigger jQuery et simulation keypress

jQuery

Discussions similaires

Partager

Partager