2010-01-23 5 views
3

Hiya, très très nouveau à jQuery et survivant sur vos merveilleux tutoriels.Je veux charger des images différentes à un div, à partir de liens

Je travaille sur le site Web de mon portfolio, et j'ai une liste de projets qui utilisent la fonction load de jQuery pour charger les descriptions de chaque projet dans un div séparé quand on clique dessus. Dans chaque description est un ensemble de liens numériques, disons 1-5, que je veux afficher des images pertinentes dans un autre div séparé lorsque l'on clique dessus. Mon problème jusqu'ici est que je ne peux pas réutiliser la fonction de chargement parce qu'elle écrase son utilisation intiiale, et ne semble pas vouloir être répercutée dans le fichier php qui contient toutes mes descriptions de projet.

Y at-il un moyen de contourner cela?

+2

Pourriez-vous poster une partie de votre code existant? – wsanville

+0

Yup, code s'il vous plaît. –

Répondre

5

Je devine seulement parce que je n'ai pas vu votre code, mais quand vous chargez dynamiquement le contenu en utilisant ajax, n'importe quel javascript à l'intérieur du nouveau contenu ne sera pas exécuté. Le meilleur moyen de contourner ce problème serait d'utiliser jQuery's live function pour cibler les liens à l'intérieur du contenu nouvellement chargé qui remplace l'image src lorsqu'on clique dessus - il n'est pas nécessaire d'utiliser load pour récupérer une image. Voici quelques exemples de code:

javascript Page d'accueil (je ne comprend pas la fonction de charge)

$('.project').live('click',function(){ 
newImg = $(this).attr('data-img'); 
$('#content img.projectImg').attr('src', newImg); 
}) 

HTML contenu chargé

<div id="content"> 

<!-- this content was dynamically loaded --> 
<img class="projectImg" style="float:right"/> 
<ul> 
<li class="project" data-img="project1.jpg">Project 1</li> 
<li class="project" data-img="project2.jpg">Project 2</li> 
</ul> 

</div> 
-1

Vous pouvez essayer d'utiliser JavaScript pur pour faire que, pas besoin de jquery

Par exemple, en changeant dynamiquement l'image ou le texte:

document.getElementById('Image_tag_ID').src = 'http:\\ bla-bla'; 
or 
document.getElementById('Div_tag_ID').innerHTML = '<h1>Hello</h1>'; 
Questions connexes