Délimiter quatre éléments imbriqués en Javascript/Html

Question

D'accord, cela me frustrant sans fin. J'ai récemment codé une page dans JS pour un copain à moi qui veut afficher des photos de mariage à une famille pour voir celles qu'ils aimeraient acheter.

J'ai utilisé une boucle pour compter 1-904:

for (beginnum=1;beginnum<=904;beginnum++) { yada yada... 

Ensuite, je pont adobe pour renommer les fichiers de l'appareil photo et être 1-904 leurs vignettes (+ 1-904 _thumb) et utilisé le numéro de boucle pour afficher 904 espaces d'image, et l'image numérotée correctement:

[Note: l'utilisation <) à la place de l'étiquette habituelle ouverte depuis le site affiche wont il]

IE ...

document.write(beginnum + ":" + "<img src='pictures" + beginnum + "_thumb.jpg' />"); 

Opera ...

document.write("<div>" + beginnum + ":" + "<img src='pictures" + beginnum + "_thumb.jpg' /></div>") 

tout cela fonctionne parfaitement dans IE et Opera (avec CSS externe modifier la div pour ne pas casser la ligne).

J'ai ensuite créé une fonction pour appeler la grande version de l'image lorsque l'on clique dessus.

Le problème est que lorsque j'essaie d'imbriquer cette fonction dans le code HTML généré par JavaScript, j'aurais besoin de quatre délimiteurs. J'ai entendu '' '' ou '' '' ou le & + numeric; travailler dans certains cas comme troisième et quatrième mais je n'arrive pas à les faire travailler ... où je rencontre un problème est ici .. .

[Note: en utilisant à nouveau <) pour la balise ouverte]

document.write("<a href='javascript:void(0); onClick= 

Depuis que je l'ai déjà épuisé »et« Je n'ai maintenant rien à utiliser pour appeler la fonction lorsqu'une image est cliqué.

Je ne demande habituellement aucune aide, mais cette fois, je ne peux pas penser à autre chose qui devrait fonctionner ... Je suppose que peut-être utiliser JS pour générer le HTML me laisse avec seulement 2 délimiteurs qui seront reconnus par le navigateur mais je ne suis pas sûr, quelqu'un sait à coup sûr? Des problèmes auxquels tout le monde peut penser?

Merci, ~ Z ~

Answer 1

Peut-être que cela fonctionnera

for (i=0; i<904;i++) 
{ 
    document.write("<div class=\"DivClassName\"><img src=\"pictures_" + i + "thumb.jpg\" onclick=\"OpenAWindowAndDisplayTheBigPhoto(" + i + ")\"></div>"); 
} 

Une autre approche: Supposons que vous mettez tout à l'intérieur d'un <DIV id="mainDIV">

var mainDIV = document.getElementByID("mainDIV"); 
var div, img, a; 
for (i=0; i<904; i++) 
{ 
    div = document.createElement("DIV"); 
    div.className = "DivClassName"; 
    a = document.createElement("A"); 
    a.href = "javascript:void(0)"; 
    a.onclick = function() {OpenAWindowAndDisplayTheBigPhoto(i);}; 
    img = document.createElement("IMG"); 
    img.src = "pictures_" + i + "thumb.jpg"; 
    mainDIV.appendChild(div); 
    div.appendChild(a); 
    a.appendChild(img); 
}; 

Answer 2

Essayez de construire la chaîne d'une pièce à la fois au lieu d'essayer de construire tout le littéral du document.write.

Chaque fois que les choses deviennent trop compliquées à suivre, faites-en une partie à la fois.

var s; 

s = "'Hello.' "; 
s += '"I must be going."'; 

Answer 3

Sans voir le code, il est difficile de dire pour un fait, mais vous pouvez Je veux profiter davantage du fait que javascript est un langage de première classe, de sorte que vous pouvez créer des fonctions et les transmettre en tant qu'arguments à d'autres fonctions, ou avoir des fonctions de retour de fonctions.

En faisant cela, vous pouvez décomposer votre page en quelque chose qui semble un peu plus facile à gérer.

Profitez également de l'événement onclick.

Vous devriez pouvoir simplifier le javascript et ainsi éviter ce problème, IMO.