Jquery popups with load ()
Question
J'ai plusieurs divs avec des projets et des noms différents. Chacune a un nom unique, et j'aimerais que lorsqu'un utilisateur clique dessus, il charge la page appropriée dans le div popupContainer
. Pour une raison quelconque, il n’appelle pas cependant.
C’est le Jquery:
$(document).ready(function(){
//Find & Open
$(".projectThumb").click(function(){
htmlName = $(this).find("img").attr("name");
$("#popupContainer").load(htmlName + ".html");
});
//Close property
$("a.close").live("click", function(){
$("#popupContainer").empty();
});
});
Voici le code HTML:
<div id="content">
<div class="projectThumb">
<img src="/img/aeffect_button_static.gif" width="146" height="199" class="button" name="aeffect" alt="" />
<p class="title">A.EFFECT: Film Poster</p>
</div>
<div class="projectThumb">
<img src="/img/lova_button_static.gif" width="229" height="199" class="button" name="lova" alt="" />
<p class="title">Lova – Summer 07’ – Titles</p>
</div>
</div>
<div id="popupContainer"></div>
La solution
Vous ne fermez pas votre fonction de premier clic et vous n'ouvrez pas le prêt (function () {...})
correctement:
$(document).ready(function(){ // <-- added missing open parens
//Find & Open
$(".projectThumb").click(function(){
htmlName = $(this).find("img").attr("name");
$("#popupContainer").load(htmlName + ".html");
}); // <-- added needed closing function
//Close property
$("a.close").live("click", function(){
$("#popupContainer").empty();
});
});
Autres conseils
Tag
<img ... >
n'a pas d'attribut & name; name " (uniquement la forme et ses composants), utilisez & id; id " :)
Vous ne fermez pas votre fonction 1er clic:
$(document).ready(function){
//Find & Open
$(".projectThumb").click(function(){
htmlName = $(this).find("img").attr("name");
$("#popupContainer").load(htmlName + ".html");
}); <-- needed
//Close property
$("a.close").live("click", function(){
$("#popupContainer").empty();
});
});
Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow