Selection multiple d'images

Version imprimable

07/04/2008, 18h21
Dator

Selection multiple d'images

Bonjour à tous,

Je vous explique mon problème : Je cherche à réaliser un script en javascript qui permet de sélectionner plusieurs images dans un ensemble d'images en appuyant sur control et en sélectionner plusieurs en cliquant sur la touche ALT (comme sur tous les OS).

Je ne vois pas du tout comment faire, récupérer les évenements sur les touches ALT et CTRL ne me semble pas compliquer mais c'est le reste qui me semble plus complex.

Quelqu'un pourrais m'indiquer une librairie qui à déjà utilisé un tel système ou alors m'expliquer comment faire ce que je souhaite.

Merci à tous !

Clément

salut,
voici une première ébauche qui permet d'écouter les clics sur la page.
Il faut rajouter entre autre la détection de la touche ctrl.

Code:

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>
<meta http-equiv="Content-Language" content="en" />
<meta name="GENERATOR" content="PHPEclipse 1.0" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>title</title>
<script language="javascript">
 
function Listen(e){
    if (!e) var e = window.event
    if (e.target) targ = e.target
    else if (e.srcElement) targ = e.srcElement
    if (targ.nodeType == 3) // defeat Safari bug
        targ = targ.parentNode
    var tname
    tname=targ.tagName
    id = targ.id;
    if (tname = "IMG")	
    	alert("You clicked on a image element width id=" + id)
    else
    	alert("You clicked on a " + tname + " element width id=" + id)
}
</script>
 
</head>
 
<body onmousedown="Listen(event)">
 
<a href="javascript:void(0);" onclick="test();">test</a>
<img src="" width="400" height="400" id="img1"/>
<img src="" width="400" height="600" id="img2"/>
</body>
</html>

07/04/2008, 19h04
knoodrake

Bonjour, juste une précision: sous linux ( ou plutôt gnome en tout cas ) ALT+Click sert à bouger les fenêtres, et c'est MAJ qui sert à sélectionner une plage de fichiers (pense-y, en modifiant la touche incriminé selon l'OS détecté par exemple).

salut, voici une version un peu améliorée. La gestion du ctrl ne gère pas l'os comme le suggère knoodrake... (ceci dit je suis gnome et j'utilise la touche ctrl pour faire une sélection non contigue)

Code:

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
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
 
<html>
<head>
<meta http-equiv="Content-Language" content="en" />
<meta name="GENERATOR" content="PHPEclipse 1.0" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>title</title>
<script language="javascript">
<!--
var img = new Array();
var div;
 
function init(){
	div = document.getElementById("select");
}
 
function Listen(e){
    if (!e) var e = window.event
    if (e.target) targ = e.target
    else if (e.srcElement) targ = e.srcElement
    if (targ.nodeType == 3) // defeat Safari bug
        targ = targ.parentNode;
    var tname;
    tname=targ.tagName;
    id = targ.id;
    if (tname == "IMG"){	
    	record(id,e.ctrlKey);
    }
}
 
function record(id,ctrl){
	if ( (img.indexOf(id) == -1) && ctrl){
		img.push(id);
	}
	else if (!ctrl){
		img = new Array(id);
	}
	showArray();
}
 
function showArray(){
	div.innerHTML = "";
	for(i=0; i < img.length; i++){
		div.innerHTML += img[i] + "<br>";
	}
}
-->
</script>
 
</head>
 
<body onmousedown="Listen(event)" onload="init()">
<div id="select"></div> 
<a href="javascript:void(0);" >test</a>
<img src="" width="400" height="400" id="img1"/>
<img src="" width="400" height="600" id="img2"/>
</body>
</html>

09/04/2008, 09h35
Dator

Merci à vous !

Enfaite je viens de trouver ce que je recherche exactement.
Dans la librairie Ext JS (qui est très bonne d'ailleur), il y a un exemple :

http://extjs.com/deploy/dev/examples...data-view.html

Ici les touche CTRL et SHIFT sont très bien employées et c'est ce que je recherche !

Si vous avez une idée ou un morceau de code qui pourrais m'aider, je vous en remercie d'avance !

Merci ,

Clément
09/04/2008, 10h37
julien.63

Citation:

Si vous avez une idée ou un morceau de code qui pourrais m'aider, je vous en remercie d'avance !

un code de quoi puisque tu dis avoir trouvé ce que tu cherchais?
09/04/2008, 10h45
madevilts

Pour ce qui est du ALT, je ne vois pas trop à quoi il sert lors d'une sélection multiple... Ctrl et Shift oui mais ALT...
09/04/2008, 11h35
Dator

@madevilts : Oui tu as raison, je me suis trompé, désolé de vous avoir mis sur la mauvaise voie.

@julien.63 : Je n'ai pas trouvé :) J'aimerais juste savoir si il existe un script qui permet d'avoir les même fonctions (CTRL, CTRL SHIFT) afin de selectionner une ou plusieurs choses en même temps :)

Merci beaucoup à tous !

Clément
09/04/2008, 11h41
madevilts

tu peux faire un onkeydown qui va changer une variable flag que tu peux intéroger à chacun des onclick ;)