Séparer HTML et javascript

[Résolu]
Signaler
Messages postés
260
Date d'inscription
jeudi 31 mai 2007
Statut
Membre
Dernière intervention
5 novembre 2010
-
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
-
Bonjour à tous !!

Je suis en train de développer mon site WEB et je souhaite séparer completement le html du js.
Dans mon js, je devrais donc avoir quelque chose du type :

document.getElementById('xx').onclick = function ()
{
    .......
}

Je voudrais utiliser ceci pour mes menus (par exemple), mais le problème est que mes menus vont être crées dynamiquement (bdd + ajax). Dans ce cas là, je ne sais pas le nombre exact de menus que je vais avoir.

Je voudrais donc savoir s'il y a un moyen de créer une fontion (du même type que l'exemple) mais qui serait 'générique', cad que je puisse réutiliser pour plusieurs composants (tout en y faisant passer un parametre (pour savoir sur quel menu j'ai cliqué par exemple))

Merci d'avance les gens !!

<hr />
lowke<sub>y

WWJD for havin' a nice code ?</sub>

7 réponses

Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
bonjour,

function toto(surquoi)
{       surquoi.onclick = function ()
        {   .......    }
}

et :
toto(document.getElementById(xx));
toto(document.getElementById(yy));...

ou par exemple
var n =1;
while document.getElementById("id_commun"+n)
{   toto(document.getElementById("id_commun"+n));
    n++;
}

ou par exemple

var n=1;

while document.getElementById("id_commun"+n)

{   document.getElementById("id_commun"+n).onclick=function()
    { ... }

    n++;

}

ou en "Orienté Objet" ?

ou... on peut probablement faire de 568 manières

<hr />                Cordialement            Bul         [mon Site]     [M'écrire]
Messages postés
260
Date d'inscription
jeudi 31 mai 2007
Statut
Membre
Dernière intervention
5 novembre 2010
1
Merci Bul !!

Exactement ce que je cherchais.
Maintenant que j'ai une bonne base, je vais pouvoir partir à la recherche des 568 autres solutions.

<hr />
lowke<sub>y

WWJD for havin' a nice code ?</sub>
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
nickel si ça baigne.

>>je vais pouvoir partir à la recherche des 568 autres
    ah ben non, j'en ai donné 3 ( sans parler de la "piste POO" ! ),
        donc 565 pas plus !


<hr />                Cordialement            Bul         [mon Site]     [M'écrire]
Messages postés
260
Date d'inscription
jeudi 31 mai 2007
Statut
Membre
Dernière intervention
5 novembre 2010
1
Youhouu !!! Tu me libère d'un énorme poid

<hr />
lowke<sub>y

WWJD for havin' a nice code ?</sub>
Messages postés
1044
Date d'inscription
lundi 7 mars 2005
Statut
Membre
Dernière intervention
13 juillet 2010
7
Tu serais pas mieux de passer par la fonction addEventListener (pour tous les navigateurs) ou attachEvent (pour IE), ça permet de surcharger les événements sans qu'il n'y ait d'obstruction.

Voici donc la méthode #4 :

function addListener(element, type, expression)
{
if (window.addEventListener)
element.addEventListener(type, expression,false);
else if (window.attachEvent)
element.attachEvent('on' + type, expression);
}

function toto (obj)
{
addListener(obj, "click", function () {
//
});
}
Messages postés
260
Date d'inscription
jeudi 31 mai 2007
Statut
Membre
Dernière intervention
5 novembre 2010
1
Salut Arto_8000 !!

Merci pour ta réponse. Je vais faire quelques recherches sur ces fonctions et je te tiendrais au courant.

<hr />
lowke<sub>y

WWJD for havin' a nice code ?</sub>
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
Arto_8000 ++;                exemple ici aussi
<hr />                Cordialement            Bul         [mon Site]     [M'écrire]