Question

我有一个问题..问题是jquery不适用于ajax内容.. 我的jquery： -

$(document).ready(function() {

$('.mainWorkImage').hover(function() {
    $(this).find('.caption').fadeIn(200);
},
function() {
    $(this).find('.caption').stop(false,true).fadeOut(200);
});

});

内容： -

            echo "<div class=\"mainWorkImage\" projects=\"".$mainResult['category']."\"><a href=\"work.php?page=".$mainResult['id']."\"><img name=\"mainWorkImage\" src=\"".$mainResult['imageUrl']."\" width=\"212\" height=\"207\" alt=\"\"/><div class=\"caption\"><p>PROJECT NAME:</p><p>".$mainResult['projectName']."</p><br/><p>PROJECT TYPE:</p><p>".$mainResult['category']."</p></div></a></div>";

这里发生的事情是我有一个下拉列表，当下拉列表更改内容将使用AJAX从DB中获取并显示..但是字幕div不显示从AJAX加载的内容。请帮我。在此先感谢...

Answer 1

取决于您的jquery版本，请查看http://api.jquery.com/on/ 替代使用“实时”处理程序。

.hover（）处理程序不起作用，因为目标在应用时不存在。

Answer 2

你可以在成功的ajax加载

上绑定函数

即。

$.ajax{
url:
data:
    success(function){
     //put your bind elements here
    }
}

或者，您可以使用on() api。

Answer 3

尝试

$(document).ready(function() {

$('body').delegate('.mainWorkImage','hover',function() {
    $(this).find('.caption').fadeIn(200);
},
function() {
    $(this).find('.caption').stop(false,true).fadeOut(200);
});

});

为加载ajax的内容应用jquery函数

3 个答案: