[Javascript] Problème de smileys

Sujet résolu

13 août 2006 à 21:42:43

Bonjour à tous cher zér0 !

Voici mon problème :
Quand je clique sur un smiley le code du smiley s'inscrit correctement dans mon textarea, mais à la fin du "contenu" entré ... :euh:

J'aimerai pouvoir par exemple quand je clique à n'importe quel endroit du texte pouvoir cliquer sur le smiley et que le code du smiley s'ajoute à l'endroit où se trouve mon curseur et non pas à la fin du "contenu" inséré dans le textarea

Je cherche depuis un petit bout de temps mais je n'ai malheureusement rien trouvé ...
Auriez-vous un script en Javascript pour y remedier ?

Merci d'avance

PS : Je voudrai vous préciser que je ne connais rien en Javascript mais que j'arrive quand même à bricoler et bidouiller ...

Ludw82

14 août 2006 à 12:38:07

Mon topic s'en va dans les oubliettes o_O

Personne ne connait de solution ?

Ludw82

15 août 2006 à 14:45:17

Je commence à croire que personne ne sais ...

Pitié aidez-moi

si vous le pouvez !!!

Gregoo

16 août 2006 à 9:37:37

Salut,
Mister oubliette arrive à la rescousse !

En fait ton problème vient d'une divergence entre les différents navigateur concernant la gestion de la position du curseur dans une zone de texte (... mais paye ta phrase

).
Pour faire plus simple : 'C'est pas partout pareil et saymal pour le développeur'.

Si tu m'affiche la ou les fonctions qui insèrent le code dans ta zone de texte, je pourrais peut-être les mettre à jour en question de compatibilité, et puis si j'ai le temps... courage (et surtout si ça t'interresse

) je t'expliquerai le pourquoi du comment du schimlimiliblick de ce que j'ai farfouillé.

Cordialement,
Gregoo

illidan

16 août 2006 à 9:48:45

tu as aussi un tuto qui est génial sur le BBcode avec les smileys mais un peu brouillon
tu peux le voir ici

Popovtaz

16 août 2006 à 9:53:39

Gregoo, pour Elwii je ne sais pas, mais moi çà m'interresse que tu expliques le pourquoi du comment

.

Dès que je rentre chez moi à midi, je poste la fonction qui insère les smilies (pas de surprise, c'est celle du tuto sur le bbcode

...).

Je pense que ce sera la même qu'Elwii puisqu'on a le même problème

.

Voilà la fonction :

function smilies(img)
{
window.document.formulaire.contenu.value += '' + img + '';
}

J'ai bien essayé de la tripatouiller mais tout ce que j'ai réussi à faire, c'est planter mon script

Gregoo

16 août 2006 à 9:55:30

Etant donnée le nuit blanche, je pense que je dormirai à midi.
M'enfin, sait-on jamais

.

Paupière lourdement,
Gregoo.

Ludw82

16 août 2006 à 11:55:38

Bonjour à tous !

Le code Javascript que j'ai est une version bidouiller du Scode qu'un Zér0 avait faite !
Je te poste le code Javascript et mon code xHTML !
La page previsualisation.js est très longue donc enregistre la sur ton PC : Lien vers le fichier

<table class="smileys">
<tr>
<td colspan="4"><h6>Smileys</h6></td>
</tr>
<tr>
<td><a href="#"><img src="images/smileys/smile.gif" alt=":)" onclick="javascript:smilies('

');return(false)" /></a></td>
<td><a href="#"><img src="images/smileys/clin.gif" alt=";)" onclick="javascript:smilies('

');return(false)" /></a></td>
<td><a href="#"><img src="images/smileys/blink.gif" alt="O_o" onclick="javascript:smilies(' o_O

');return(false)" /></a></td>
<td><a href="#"><img src="images/smileys/bof.gif" alt=":bof:" onclick="javascript:smilies(' :bof: ');return(false)" /></a></td>
</tr>
<tr>
<td><a href="#"><img src="images/smileys/nargue.gif" alt=":P" onclick="javascript:smilies('

');return(false)" /></a></td>
<td><a href="#"><img src="images/smileys/emu.gif" alt=":emu:" onclick="javascript:smilies(' :emu: ');return(false)" /></a></td>
<td><a href="#"><img src="images/smileys/hihi.gif" alt="^^" onclick="javascript:smilies('

');return(false)" /></a></td>
<td><a href="#"><img src="images/smileys/lol.gif" alt=":lol:" onclick="javascript:smilies(' :lol:

');return(false)" /></a></td>
</tr>
<tr>
<td><a href="#"><img src="images/smileys/love.gif" alt=":love:" onclick="javascript:smilies(' :love: ');return(false)" /></a></td>
<td><a href="#"><img src="images/smileys/mechant.gif" alt=":colere:" onclick="javascript:smilies('

');return(false)" /></a></td>
<td><a href="#"><img src="images/smileys/siffle.gif" alt=":-°" onclick="javascript:smilies(' :-°' );return(false)" /></a></td>
<td><a href="#"><img src="images/smileys/triste.gif" alt=":(" onclick="javascript:smilies('

');return(false)" /></a></td>
</tr>
</table>

Je voulai préciser que ce problème n'est pas que sous IE c'est aussi le même cas pour Mozilla Firefox !

Merci d'avance pour ton aide Gregoo !

PS pour illidan : J'ai déjà lu ce tuto mais il ne correspondait pas vraiment à ce que je veux (de plus il bugger pas mal son code Javascript !)

Gregoo

16 août 2006 à 12:36:38

Salut,
je viens de regarde le JavaScript et effectivement, le script fait bien ce qu'on lui dit de faire :

function smilies(img) {
window.document.forms[0].contenu.value += '' + img + '';
}

Il ajoute le smiley en fin de textarea.
Dans ton JavaScript, la fonction qui est chargée d'inserer le texte à l'endroit du curseur est balise().

Si on prend la fonction d'insertion de citations : citations()(qui elle utilise balise()) :

....et qu'on la transforme en smilies() :

function smilies(img, id_input) {
balise(id_input, img, false);
}

...cette fois-ci la fonction smilies() utilise la fonction balise() et les smileys devraient s'afficher au bon endroit.

Il en faut pas oublier de modifier un peu les champs qui utilisent la fonction smilies() car il faut rajouter un argument l'ID de la zone de saisie. Je ne l'ai pas sous les yeux mais c'est le meme que celui utilisé dans citation() ou lien(), ce qui donne :

<a href="#"><img src="images/smileys/smile.gif" alt=":)" onclick="javascript:smilies('

', '{ID de la textarea}');return(false)" /></a>

En esperant que ça marche,
Gregoo

Ludw82

16 août 2006 à 12:44:31

Merci merci merci merci merci merci merci beaucoup !!!

Tout marche hyper bien

!!!

EDIT : J'ai parlé trop vite ... Quand je clique sur un smiley il affiche le code du smiley mais après il ajoute false ...

<a href="#"><img src="images/smileys/smile.gif" alt=":)" onclick="javascript:smilies('

', 'contenu');return(false)" /></a>

EDIT 2 : J'ai fini par trouvé le problème j'ai fait une petit modification :

function smilies(img, id_input) {
balise(id_input, img, '');
}

Merci à vous tous !