Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
3350 connectés 

 


 Mot :   Pseudo :  
 
 Page :   1  2  3
Page Suivante
Auteur Sujet :

foreach en javascript

n°975631
freed102
Arayashiki
Posté le 08-02-2005 à 16:56:20  profilanswer
 

Reprise du message précédent :
Voici le code "nettoyé et plus lisible"
 

Code :
  1. function ActionColor(couleur,nom,div,input)
  2. {
  3. document.getElementById('form2').elements[input].value = couleur
  4. document.getElementById(nom).style.background='#'+couleur;
  5. toggleDisplay(div);
  6. }
  7. function AffichePalette(nom,div,input)
  8. {
  9. var hex_array=["00","33","66","99","CC","FF"];
  10. var d="Choisissez votre couleur \n";
  11. for(red in hex_array)
  12. {
  13.  d+='<div id="coulrange'+ hex_array[red] +'" class="coulrange"> \n';
  14.  d+='<table> \n';
  15.  d+='<tr> \n';
  16.  d+='<td> \n';
  17.  for(green in hex_array)
  18.  {
  19.   d+='<table> \n';
  20.   d+='<tr> \n';
  21.   for(blue in hex_array)
  22.   {
  23.  d+=' \t <td width="10" height="10"';
  24.  d+='bgcolor="#'+ hex_array[red] + hex_array[green] + hex_array[blue] +'">';
  25.  d+='<a class="closeLink" href="#" ';
  26.  d+='onclick="ActionColor(\'' + hex_array[red] + hex_array[green] + hex_array[blue] +'\',\''+nom+'\',\''+div+'\',\''+input+'\');return false;"> ';
  27.  d+='<img src="dummy.gif" alt="'+ hex_array[red] + hex_array[green] + hex_array[blue] +'" width="10" height="10" />';
  28.  d+='</a>';
  29.  d+='</td> \n';
  30.   }
  31.   d+='</tr> \n';
  32.   d+='</table> \n';
  33.  }
  34.  d+='</tr> \n ';
  35.  d+='</td> \n ';
  36.  d+='</table> \n ';
  37.  d+='</div> \n';
  38. }
  39. document.getElementById(div).innerHTML = d;


Message édité par freed102 le 08-02-2005 à 17:29:02
mood
Publicité
Posté le 08-02-2005 à 16:56:20  profilanswer
 

n°975674
freed102
Arayashiki
Posté le 08-02-2005 à 17:22:15  profilanswer
 

et voici le code généré par mes fonctions (indirectement en faisant un document.write ):
 
http://www.clonecopy.net/php/ezdocs/couleurs.txt
 
qui affiche cela :
 
http://www.clonecopy.net/php/ezdocs/couleurs.htm
 

n°975689
freed102
Arayashiki
Posté le 08-02-2005 à 17:35:51  profilanswer
 

resultat des economies :
 
avant : 723K (html) + 17,2K (images+fichiers js)
maintenant : 104K (html) + 42K (fichiers bitmap + js)

n°975701
Azzazel
Posté le 08-02-2005 à 17:47:35  profilanswer
 

Si ça peut aider pour le DOM : http://www.mozilla.org/docs/dom/do [...] ortIX.html
Attention par contre car c'est le DOM GEcko ... tout ne fonctionnera pas forcement sur IE qui n'a pas forcement la même version...

n°975704
freed102
Arayashiki
Posté le 08-02-2005 à 18:02:35  profilanswer
 

merci !  
 
mais alors question :
 
là ce que je viens de faire... mis à part le innerHTML... c'est pas du DOM ?

n°976019
FlorentG
Posté le 09-02-2005 à 08:05:25  profilanswer
 

Nope, innerHTMl c'en est pas. Faut utiliser des fonctions genre createElement pour créer un élément, setAttribute et setContent pour définir certains attributs ainsi que le contenu, et enfin appendChild pour ajouter l'éléments dans la structure xHTML

n°976194
freed102
Arayashiki
Posté le 09-02-2005 à 10:51:57  profilanswer
 

ok kool ! mais alors question :
est ce toujours du javascript ? je peux inclure des fonctions DOM comme ça en plein milieu de mon javascript classique ?

n°976199
FlorentG
Posté le 09-02-2005 à 10:57:54  profilanswer
 

Ouais, c'est toujours du javascript ;) Ca doit être depuis la version 1.2 ou un truc comme ça qu'ils ont implémenté les fonctions DOM

n°976208
freed102
Arayashiki
Posté le 09-02-2005 à 11:03:55  profilanswer
 

alors ça commence bien ! lol !
 
d =document.createElement('d');
div.appendChild('d');
 
resultat :
 
Error: div.appendChild is not a function
Source File: http://clonecopy.net/php/ezdocs/javascript2.php
Line: 118
:lol:

n°976212
FlorentG
Posté le 09-02-2005 à 11:05:02  profilanswer
 

C'est quoi ton objet 'div' :??: Il est déclaré nulle part

mood
Publicité
Posté le 09-02-2005 à 11:05:02  profilanswer
 

n°976213
freed102
Arayashiki
Posté le 09-02-2005 à 11:05:15  profilanswer
 

je sais.. j'ai du faire n'importe quoi ! :lol:

n°976214
freed102
Arayashiki
Posté le 09-02-2005 à 11:05:36  profilanswer
 

bah div c un argument dans ma fonction, c là ou je veux que ça s'ecrive !


Message édité par freed102 le 09-02-2005 à 11:06:05
n°976215
FlorentG
Posté le 09-02-2005 à 11:06:21  profilanswer
 

C'est l'id de la div ?
 
Si c'est le cas, faudra faire :

document.getElementById(div).appendChild(d);

n°976216
freed102
Arayashiki
Posté le 09-02-2005 à 11:07:52  profilanswer
 

oula !!! là maintenant j'ai une erreur genre charabia indescriptible ! lol ! :lol:
 
Error: uncaught exception: [Exception... "Could not convert JavaScript argument arg 0 [nsIDOMHTMLDivElement.appendChild]"  nsresult: "0x80570009 (NS_ERROR_XPC_BAD_CONVERT_JS)"  location: "JS frame :: http://clonecopy.net/php/ezdocs/javascript2.php :: AffichePalette :: line 118"  data: no]

n°976218
FlorentG
Posté le 09-02-2005 à 11:08:53  profilanswer
 

oula

n°976315
freed102
Arayashiki
Posté le 09-02-2005 à 13:06:31  profilanswer
 

bon je commence à capter le truc... faut que j'arrive à m'habituer aux systemes de hierarchie et de noeuds je pense...

n°976337
freed102
Arayashiki
Posté le 09-02-2005 à 13:26:49  profilanswer
 

c pas facile... ya peu d'exemples ! :(

n°976418
freed102
Arayashiki
Posté le 09-02-2005 à 14:34:37  profilanswer
 

bouh !  
 
Error: uncaught exception: [Exception... "Node cannot be inserted at the specified point in the hierarchy"  code: "3" nsresult: "0x80530003 (NS_ERROR_DOM_HIERARCHY_REQUEST_ERR)"  location: "http://clonecopy.net/php/ezdocs/javascript2.php Line: 134"]

n°976427
FlorentG
Posté le 09-02-2005 à 14:40:32  profilanswer
 

T'essaye de mettre l'élément où ?

n°976430
freed102
Arayashiki
Posté le 09-02-2005 à 14:42:08  profilanswer
 

bah en fait je m'emmele les crayons avec les noeuds... je vais essayer de capter

n°976436
freed102
Arayashiki
Posté le 09-02-2005 à 14:45:20  profilanswer
 

en fait je suis kéblo à cet endroit là :
 

Code :
  1. var hex_array=["00","33","66","99","CC","FF"];
  2. var d="Choisissez votre couleur \n";
  3. var doc=document.getElementById(div);
  4. for(red in hex_array)
  5. {
  6.  element1=document.createElement("div" );
  7.  doc.appendChild(element1);
  8.  attr1=document.createAttribute("id" );
  9.  element1.appendChild(attr1); //<-ligne 134
  10.  param1=document.createTextNode("coulrange"+ hex_array[red]);
  11.  element1.appendChild(param1);
  12.  attr2=document.createAttribute("class" );
  13.  element1.appendChild(attr2);
  14.  param2=document.createTextnode("coulrange" );
  15.  attr2.appendChild(param2);
  16.  element2=document.createElement("table" );
  17.  doc.appendChild(element2);
  18. [...]


Message édité par freed102 le 09-02-2005 à 14:46:45
n°976440
FlorentG
Posté le 09-02-2005 à 14:46:23  profilanswer
 

oula oula c'est comme ça :

Code :
  1. element1=document.createElement("div" );
  2. doc.appendChild(element1);
  3. element1.setAttribute("id", "pouet" );

n°976442
freed102
Arayashiki
Posté le 09-02-2005 à 14:47:11  profilanswer
 

ahh c plus simple à mon avis

n°976471
freed102
Arayashiki
Posté le 09-02-2005 à 14:58:55  profilanswer
 

g reussi !!! :d :d :d
 

Code :
  1. function AffichePalette(nom,div,input)
  2. {
  3. var hex_array=["00","33","66","99","CC","FF"];
  4. var d="Choisissez votre couleur \n";
  5. var doc=document.getElementById(div);
  6. for(red in hex_array)
  7. {
  8.  element1=document.createElement("div" );
  9.  doc.appendChild(element1);
  10.  element1.setAttribute("id", "coulrange"+ hex_array[red]);
  11.  element1.setAttribute("class", "coulrange" );
  12.  element2=document.createElement("table" );
  13.  element1.appendChild(element2);
  14.  element3=document.createElement("tr" );
  15.  element2.appendChild(element3);
  16.  element4=document.createElement("td" );
  17.  element3.appendChild(element4);
  18.  for(green in hex_array)
  19.  {
  20.   element5=document.createElement("table" );
  21.   element4.appendChild(element5);
  22.   element6=document.createElement("tr" );
  23.   element5.appendChild(element6);
  24.   for(blue in hex_array)
  25.   {
  26.   element7=document.createElement("td" );
  27.   element6.appendChild(element7);
  28.   element7.setAttribute("width", "10" );
  29.   element7.setAttribute("height", "10" );
  30.   element7.setAttribute("bgcolor", "#"+ hex_array[red] + hex_array[green] + hex_array[blue]);
  31.   element8=document.createElement("a" );
  32.   element7.appendChild(element8);
  33.   element8.setAttribute("class", "closeLink" );
  34.   element8.setAttribute("href", "#" );
  35.   element8.setAttribute("onclick", "ActionColor(\'' + hex_array[red] + hex_array[green] + hex_array[blue] +'\',\''+nom+'\',\''+div+'\',\''+input+'\');return false;" );
  36.   element9=document.createElement("img" );
  37.   element8.appendChild(element9);
  38.   element9.setAttribute("src", "dummy.gif" );
  39.   element9.setAttribute("alt",  hex_array[red] + hex_array[green] + hex_array[blue]);
  40.   element9.setAttribute("witdh", "10" );
  41.   element9.setAttribute("height", "10" );
  42.   }
  43.  }
  44. }
  45. }


Message édité par freed102 le 09-02-2005 à 14:59:28
n°976476
freed102
Arayashiki
Posté le 09-02-2005 à 15:01:04  profilanswer
 

ya plus qu'un petit prob de concatenation genre :
 
element1.setAttribute("id", "coulrange"+ hex_array[red]);

n°976478
FlorentG
Posté le 09-02-2005 à 15:02:11  profilanswer
 

A cause de ça, t'aura plusieurs éléments avec le même ID, donc faut changer ;)

n°976497
freed102
Arayashiki
Posté le 09-02-2005 à 15:12:34  profilanswer
 

ouaich maintenant j'ai un prob avec une autre fonction (une variable qui passe pas sans doute ! grrrrr !) lol
 
 

Code :
  1. element8.setAttribute("onclick", "ActionColor(' "+ hex_array[red] + hex_array[green] + hex_array[blue] +" ',' "+nom+" ',' "+div+" ',' "+input+" '); return false;" );


 
le input ne passe pas
 
 
Error: document.getElementById("form2" ).elements[champ] has no properties
Source File: http://clonecopy.net/php/ezdocs/javascript2.php
Line: 77


Message édité par freed102 le 09-02-2005 à 15:16:51
n°976550
freed102
Arayashiki
Posté le 09-02-2005 à 15:32:49  profilanswer
 

comment je fais si je veux voir le code que ça genere ? afficher source ça n'affiche pas le code :(

n°976561
FlorentG
Posté le 09-02-2005 à 15:36:06  profilanswer
 

Tu fais sous FireFox Ctrl+A pour tout sélectionner, et tu fais bouton-droit quelque part, et t'as "View Selection Source", qui te permet de voir le code généré :)

n°976818
freed102
Arayashiki
Posté le 09-02-2005 à 17:46:03  profilanswer
 

Alors j'ai remplacé tous les tableaux par des listes avec un CSS :
 

Code :
  1. function AffichePalette(nom,div,champ)
  2. {
  3. var hex_array=["00","33","66","99","CC","FF"];
  4. var d="Choisissez votre couleur \n";
  5. var doc=document.getElementById(div);
  6. element0=document.createTextNode(d);
  7. doc.appendChild(element0);
  8. for(red in hex_array)
  9. {
  10.  element1=document.createElement("div" );
  11.  doc.appendChild(element1);
  12.  element1.setAttribute("id", "coulrange"+ hex_array[red]);
  13.  element1.setAttribute("class", "coulrange" );
  14.  element5=document.createElement("ul" );
  15.  element1.appendChild(element5);
  16.  element5.setAttribute("class", "colorlist" );
  17.  for(green in hex_array)
  18.  {
  19.   for(blue in hex_array)
  20.   {
  21.   element7=document.createElement("li" );
  22.   element5.appendChild(element7);
  23.   element7.style.backgroundColor="#"+ hex_array[red] + hex_array[green] + hex_array[blue];
  24.   element8=document.createElement("a" );
  25.   element7.appendChild(element8);
  26.   element8.setAttribute("class", "closeLink" );
  27.   element8.setAttribute("href", "#" );
  28.   element8.setAttribute("onclick", "ActionColor(' "+ hex_array[red] + hex_array[green] + hex_array[blue] +" ',' "+nom+" ',' "+div+" ',' "+champ+" '); return false;" );
  29.   element9=document.createElement("img" );
  30.   element8.appendChild(element9);
  31.   element9.setAttribute("src", "dummy.gif" );
  32.   element9.setAttribute("alt",  hex_array[red] + hex_array[green] + hex_array[blue]);
  33.   element9.setAttribute("width", "10" );
  34.   element9.setAttribute("height", "10" );
  35.   }
  36.  }
  37. }
  38. }


 
et mon CSS (pour l'instant)

Code :
  1. .colorpannel{
  2. padding:0px;
  3. width:345px;
  4. margin:auto;
  5. }
  6. .coulrange {
  7. float:left;
  8. padding:2px;
  9. width:110px;
  10. }
  11. .colorlist
  12. {
  13. padding: 0px;
  14. margin:auto;
  15. }
  16. .colorlist li
  17. {
  18. padding: 0px;
  19. margin: 2px;
  20. width:10px;
  21. height:10px;
  22. border: 1px solid #CCCCCC;
  23. float:left;
  24. list-style-type:none;
  25. }


 
 
ça allège encore un peu ! pas facile de caler tout ça mais c bien...
 
le seul hic c que sur IE il me fait une erreur Javascript ! (à la ligne 57) et je sais pas pourquoi parcequ'il y a pas de Javascript à la ligne 57 :(

n°976827
FlorentG
Posté le 09-02-2005 à 17:53:24  profilanswer
 

Aussi, attention, dans les fonctions DOM, faut remplacer "class" par "className"

n°976841
freed102
Arayashiki
Posté le 09-02-2005 à 18:08:25  profilanswer
 

ah mais oui mais ça march pu ! :(

n°976880
freed102
Arayashiki
Posté le 09-02-2005 à 18:42:01  profilanswer
 

ouech !sur Firefox ça marche presque.. sur IE c'est erreur JS  
... c pô gagné encore ! :lol:

n°976893
FlorentG
Posté le 09-02-2005 à 18:51:49  profilanswer
 

Courage :)

n°976897
freed102
Arayashiki
Posté le 09-02-2005 à 18:52:49  profilanswer
 

on verra ça demain ! là j'ai une tete² ! lol !
merci en tous cas pour ton aide ! ;)

n°977473
freed102
Arayashiki
Posté le 10-02-2005 à 11:36:34  profilanswer
 

tiens c pas mal ça ! lol ! j'avais pas vu ! sur firefox quand je cliques plusieurs fois sur le bouton pour afficher la palette de couleur...et bien j'ai ma palette qui se repete plusieurs fois !! :lol:

n°977483
FlorentG
Posté le 10-02-2005 à 11:40:15  profilanswer
 

Ah ben oui, faut d'abord générer les palettes, puis les masquer. Et le fait de cliquer sur le bouton ne devrait pas en recréer une, mais plutot l'afficher, puis la masquer quand y'a plus besoin

n°980863
freed102
Arayashiki
Posté le 14-02-2005 à 12:10:47  profilanswer
 

suis resté keblo là dessus :
 
 
Error: document.getElementById("form2" ).elements[champ] has no properties
Line: 77
 
 
edit : c hors sujet je crée un nouveau topic


Message édité par freed102 le 14-02-2005 à 12:16:48
mood
Publicité
Posté le   profilanswer
 

 Page :   1  2  3
Page Suivante

Aller à :
Ajouter une réponse
 

Sujets relatifs
Erreurs avec javascriptin_array en javascript ?
Insérer une variable javascript dans dans HTML [RESOLU]Comment savoir si on est sur le dernier element d'un foreach
JSP jstl <c:forEach> probleme!!!!javascript: popup/frames/opener : pb de sécurité pour mozilla ?
caractere blanc de php/javascriptJavascript / frames et formulaire :)
liste deroulante dynamique PHP/Javascriptjavascript et linux
Plus de sujets relatifs à : foreach en javascript


Copyright © 1997-2025 Groupe LDLC (Signaler un contenu illicite / Données personnelles)