Discussion :

[Arsene12]

Bonjour,
merci pour ce complément d'explications. Je crois que je peux arriver à comprendre mais il faut de la patience.

Dans mon application, je crée les éléments comme ceci :

Code :

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

var myval = $('#maFen').append('<span id = "monMot'+i+'" class=".clickable"  >' + record.Mot (le Mot provient d'un BDD) + '</span>');

Pour tester la class .clickable, j'ai ajouter ceci, mais ça fonctionne pas :

Code :

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

1
2
3
4
5
6
7
8
$(document).ready(function() {
$("body").on("click",".clickable",function(){
alert ("ok");
 
  //Id=$(this).attr("id");       
  //mesWords($(this).css("background-color"));
});
});

(avec $("#body").on("click",".clickable",function() ou $("#maFen").on("click",".clickable",function(), c'est pareil)

[Toufik83]

Code :

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

1
2
 
append('<span id = "monMot'+i+'" class="clickable"  >' + record.Mot (le Mot provient d un BDD) + '</span>');

erreurs : enlève le point dans class=".clickable", tu met juste class="clickable" sans point.
tu ne met le point que dans la fonction

Code :

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

$("body").on("click",".clickable",function()..});

[Arsene12]

Ça marche! J'ai donc réussi ce que je voulais faire au départ.

https://jsfiddle.net/qughc5a6/38/

Je vous remercie beaucoup.

[Toufik83]

parfait, reste a nettoyer un peu ton code jquery+html,bonne continuation.
n'oublis pas de passer le sujet en résolu.

[Arsene12]

J'ai quand même un problème. Ça ne marche pas dans mon application.

J'ai une fonction qui crée les éléments et qui est en dehors de : $(document).ready(function() {

Si je l'intègre, ça ne marche plus du tout.

Dans jsfiddle, y'a le $("#monMot'+j+'").css({"background-color": "#C0C0C0"}); qui marche pas

https://jsfiddle.net/qughc5a6/40/

Dans mon application, je peux même pas faire une alert dans $("body").on("click",".clickable",function()..});.

[Toufik83]

dans ce cas, l'erreur doit être dans ton code, et on ne peut pas t'aider si on ne voit pas comment tu gère les choses.
il faut aussi savoir comment enregistrer un lien jsfiddle, ton dernier lien que tu as mis https://jsfiddle.net/qughc5a6/40/ est la 40éme version, si tu clique sur DashBord, tu trouvera 40 version enregistré, alors qu'il faut l'enregistrer qu'une seule fois. pour le faire, après le changement de votre script, tu clique sur Update, puis Set as Base.

[Arsene12]

Bonjour,

j'avais constaté que j'étais à la 40ème version. En cliquant sur Fork on peut effectivement créer un lien tout neuf.

https://jsfiddle.net/gwk1k9yL/

Cela dit, ça m'explique pas pourquoi $("#monMot'+j+'").css({"background-color": "#C0C0C0"}); ne fonctionne pas lorsque je clique sur le bouton.

[Arsene12]

Par contre, dans mon application ça marche si après .append('<span id = "monMot'+j+'" class="clickable" >' +"Mot" +'</span>'); je met le code :

Code :

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

1
2
3
4
5
6
7
8
9
10
$('#monMot'+j+'').one('click', function () {
                    $obj = $(this);
                    $text = $obj.text();
                    alert($text);                       
                     var xcol = rgb2hex($obj.css("background-color"));              
                     if (xcol=="#c0c0c0") {                      
                     alert ("ok")
                     $obj.css({"background-color": "Crimson"}); 
                    }
                  });

[Arsene12]

je vais donc intégrer le $('#monMot'+j+'').one('click', function ()

dans $.each(data, function(index,record){ ...}

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
$.each(data, function(index,record) {
....
append('<span id = "monMot'+i+'" >' + record.Mot (le Mot provient d un BDD) + '</span>');
....
$('#monMot'+j+'').one('click', function () {
                    $obj = $(this);
                    $text = $obj.text();
                    alert($text);                       
                     var xcol = rgb2hex($obj.css("background-color"));              
                     if (xcol=="#c0c0c0") {                      
                     alert ("ok")
                     $obj.css({"background-color": "Crimson"}); 
}
....
});

[NoSmoking]

John Resig pleure

( je sais, c'est de mauvais goût mais là je craque !!!)