Récupérer un ID apres selection

Version imprimable

04/03/2010, 15h14
zaiim

Récupérer un ID apres selection

Bonjour a tous

j aimerais réaliser un script qui me permet de récupérer les id des spans d un texte sélectionner

Exp : j ai un texte comme celui la :

L'élection présidentielle a commencé dans le calme.

le code source de cette page est de cette facon :

Code:

Lélectionprésidentielleacommencédansle calme

comme vous voyez chaque mot est entouré par un span avec un id unique
donc si je selectionne "a commencé" et je clique sur un bouton je reucpére
"w_3" et "w_4"

Vraiment je suis bloqué depuis quelque jours :oops: , je trouve pas de solution si quelqu'un a un idée merci de m aider .

Merci

j'imaginerais bien un truc sur le onmousedown sur chaque span et un push des id dans un array

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
 
<script type="text/javascript">
tab=new Array()
active=false
$(document).ready(function(){
 	$('dl').children().mousedown(function(){
								 	            tab.length=0;
								 	            active=true;
								 	            tab.push($(this)[0].id)
 	 								})
 
 
 	$('dl').children().mouseover(function(){
 	            								if (active){tab.push($(this)[0].id)}
 	            						})
 	$('dl').children().mouseup(function(){
 	            active=false
 	            })
 	})
 
 
</script>
 
</head>
 
<body>
 
<input type='button' onclick="alert(tab)" value="go"/>
	<dl>
		<dt id="one">Pourquoi j'ai un message m'indiquant que le javascript n'est pas activé ?</dt>
		<dd id="two">Lorem ipsum dolor </dd>
		<dt id='three'>Pourquoi j'ai un message m'indiquant que le javascript n'est pas activé ?</dt>
		<dd id='four'>Lorem ipsum dolor sit ame </dd>
	</dl>

ça marche pas si on commence à selectionner en dehors du span masi l'idée de base est là

04/03/2010, 16h37
zaiim

Merci pour la réponse

Mais le problème moi je veux récupérer les ID lors d une sélection , donc il se peut qu'il y est plusieurs mots donc plusieurs ID :(
04/03/2010, 16h44
SpaceFrog

ce qui est le cas avec le code ci dessus ...
il met dans un array les id des differentes zones qui continnent la selection ...
04/03/2010, 17h11
zaiim

ah d accord

mais je sais pas pourquoi je l ai tester il m alert un tableau vide !! :oops:
05/03/2010, 14h40
zaiim

re bonjour

SpaceFrog merci de votre réponse , mais est ce que tu peux m aider pour tester ton code car l alert que j ai est vide , donc le tableau est vide , il ne retourne aucun ID

Merci
05/03/2010, 14h48
vermine

Bonjour,

on dirait du jQuery. Vous devez utilisez les bibliothèques du jQuery pour que ce code soit opérationnel.
05/03/2010, 14h54
SpaceFrog

Arf oui désolé, j'étais persuadé qu'a la base le code initial comportatn du jquery ...
Il faut donc inclure la lib jquery
05/03/2010, 15h01
zaiim

Oui ca marche , en fait oui j ai oublie d intégrer la bibliothèque :ccool:

reste a adapter ce code avec des spans .
05/03/2010, 15h21
zaiim

je sais qu'il faudrait changer " $('dl').children() " si je vais utiliser les spans mais je trouve le bon parcours ou le bon attribut a utiliser :oops:
05/03/2010, 15h44
SpaceFrog

dl etant dans mon exemple le parent ...
08/03/2010, 13h52
zaiim

salut

là je veux vider le tableau avant chaque click
j ai essaye avec tab.clear() mais il y a souci ca marche pas !
08/03/2010, 14h17
SpaceFrog

Code:

tab.length=0
08/03/2010, 16h08
zaiim

jusque là ca marche ... mais je sais pas pourquoi dés fois il m alert des faux valeurs et si je sélectionne plusieurs lignes en même temps aussi il m alert des fausses valeurs

:cry:
08/03/2010, 16h24
SpaceFrog

je t'ai dit c'est juste une question de declencheur ... il faudrait en fait sur le body modifier une variable flag boolean sur le mousedown et l'inverser sur le mouseup et mettre ensuite les valeur dans le tableau sur le mouseover.

tu peux être un peu plus claire , je suis encore débutant :oops:

voila le code que j ai maintenant :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
 
<script type="text/javascript">
tab=new Array()
active=false
$(document).ready(function(){
	$('span').mousedown(function(){
		tab.length=0;
		active=true;
		tab.push($(this)[0].id)
 	})
 
 
 	$('span').mouseover(function(){
 	    if (active){tab.push($(this)[0].id)}
 	})
 	$('span').mouseup(function(){
 	    active=false
 	})
 
})
</script>

09/03/2010, 14h11
zaiim

Space j ai pas compris la dernière manip que tu as mis :calim2:
09/03/2010, 14h25
SpaceFrog

decompose les action de ce dont tu as besoin ...

selection=> bouton de souri enfoncé ou utilise onselectstart poru activer le flag boolean

sur le mouseover des zone tu renseignes le tableau

sur le onselectend tu modifies le flag bool qui stopperas le renseignement du tableau sur le mousover
09/03/2010, 14h37
zaiim

merci pour ta réponse

est ce que je peux récupérer le tableau qu'on alertait au début dans un un input hidden !!

cad au moment du onclick on alert plus le tableau mais on insère les valeurs dans un input
09/03/2010, 15h14
SpaceFrog

non pas l'array directement mais une concaténation avec séparateur oui ...
09/03/2010, 16h12
zaiim

oui c est ce que j ai fait :mouarf: