Question

对不起......

在那里找到任何答案，但仍然没有效果。

所以有我的脚本：

$(document).ready(function() {
$('.gifs').gifplayer();
});

由AJAX加载的动态内容：

<img class="gifs post img-responsive img-bordered" width="100%" src="<?php echo $post->thumb_url;?>" data-gif="<?php echo $post->url;?>" />

带有“gifs”类的图像应该称为“gifplayer”功能。但每次ajax加载，它都无法正常工作。我应该怎么做才能最好地实现这个目标？

这就是全部，谢谢你......

Answer 1

当AJAX将动态内容添加到DOM时，Ready事件中的代码已经执行。

只有在AJAX调用成功完成后，才应该调用$（＆＃39; .gifs＆＃39;）。gifplayer（）。在jQuery中，这将通过.done或.success事件处理程序。

这是一个jQuery示例：

$(function() {
    getData();
});

function getData() {
    $.get( "test.php" )
    .done(function( data ) {
        $('.gifs').gifplayer();
    });
}

如果您正在进行多个AJAX调用或者使用非ajax加载的.gifs元素，那么您必须更加优雅以确保gifplayer（）仅在它们上面调用一次。

Answer 2

此代码：

$('.gifs').gifplayer();

仅对当时jQuery 找到的元素执行gifplayer() 。代码行仅在页面准备好时执行一次，而不再执行。 jQuery无法识别尚不存在的元素。

向页面添加更多元素时，需要再次执行该代码。如果您不应该为相同的元素重新执行，那么您将需要修改您的jQuery选择器以仅识别新的。

AJAX加载后jQuery Ready事件无效

2 个答案: