Cascade de fonction .each() pour ajouter des enfants
Bonjour,
J'ai un problème dans mon code JQuery dans une cascade de fonction .each().
Voici mon code, que j'ai déjà posté précédemment... :
Le code html concerné :
Code:
1 2 3 4 5
|
<form id="LoginForm">
<p>Nom d'utilisateur :<input type="text" size="15" class="TextField" name="username" id="username" /></p> <hr/>
<p>Mot de passe :<input type="password" size="15" class="TextField" name="password" id="password" /></p>
<input id="ValidateBt" type="submit" accesskey="l" name="login" value="Login" /> |
Ainsi qu'un deuxième form, quasi identique.
Je les sélectionne pour leur appliquer un plugin JQuery de cette manière :
Code:
$("form").Loginify();
Et le code de mon code JQuery se résume à :
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
|
(function ($)
{
jQuery.fn.Loginify = function (options)
{
var i; // Go in every children field to add pictures
var Pictures = new Array
(
document.createElement ("img"),
document.createElement ("img"),
document.createElement ("img")
);
Pictures[0].setAttribute ('src', './images/RedLight.png');
Pictures[1].setAttribute ('src', './images/YellowLight.png');
Pictures[2].setAttribute ('src', './images/GreenLight.png');
for (i in Pictures)
{
Pictures[i].setAttribute ('width', '20px');
Pictures[i].setAttribute ('height', '20px');
}
// We apply the plugin for any selected field
return this.each (function ()
{
$(this).children("p").each (function ()
{
$(this).append (Pictures);
alert ($(this).html());
});
alert ($(this).html());
});
};
})(jQuery); |
pour le moment.
Mon problème est le suivant :
Quand je charge ma page, toutes les fenêtres "alert" s'affichent correctement avec le bon contenu modifié. Mais lorsque la dernière fenêtre s'affiche pour me donner le résultat final sur la balise <form>, je constate que seule la dernière balise <p> contient mes images ajoutées.
Puis, au tours du deuxième form, même chose sauf que lorsque toutes les alertes sont passées, il n'y a des images que sur la toute dernière balise <p> constituant la sélection sur les deux formulaires.
Est-ce que quelqu'un peut m'aider svp ?
Merci !