jQuery: OnClick Handling af indhold hentet via .load()
Hej AlleJeg har et site, som loader HTML-indhold ind i en div vha. .load i jQuery:
if(productsLoaded == 0){
$("#productsContainer").load('inc/products.html');
bind();
productsLoaded = 1;
}
I det loadede indhold har jeg en DIV med ID="productBox":
<div onmouseover="this.className='productBoxHover';" onmouseout="this.className='productBox';" class="productBox" id="productBox"><div class="productInnerBox"><img src="images/tn-model1.png"></div><b>Product 1</b><br>Short description here. Short description here. Short description here.</div>
Og målet er at få den til at binde vha. denne funktion i super-filen:
$("#productBox").click(function(){
if(page == "home"){
$("#header").animate({height:0},400);
$("#productContainer").load('inc/product.html');
$("#productContainer").slideDown(400);
} else {
$("#productsContainer").slideUp(400);
$("#aboutContainer").slideUp(400);
$("#conceptContainer").slideUp(400);
$("#productsContainer").slideUp(400);
$("#productContainer").load('inc/product.html');
setTimeout(function() {$("#productContainer").slideDown(400);},400);
}
page = "product";
});
Efter indholdet loades via .load bliver ovenstående kørt vha. en bind-metode - problemet er dog at eventhandleren stadig ikke tilknyttes. Har i nogle gode forslag til hvordan jeg kan tilknytte en handler i super-filen til loadet indhold i sub-filen efter den er loadet?
På forhånd tak!
- Rasmus