0

我有一个能够通过 ajax 加载更多内容的图像列表。默认情况下，列表中会加载图像。当用户滚动时，另外 4 个项目被添加到列表中。该列表每 15 秒通过 ajax 刷新一次，仅替换列表中的前 7 个项目。问题是当 4 个新项目添加到列表中时，选择器似乎忽略了这些项目，因此它不会从 0 索引中进行选择。

我知道这听起来令人困惑，所以我将尝试通过一个简单的示例进行演示。

前任

$(function () {
    // Update ChannelStats
    setTimeout(function () {
        var refresh = setInterval(UpdateChannels, 15000);
        UpdateChannels();
    }, 15000);

    function UpdateChannels() {
        $.ajax({
            type: "POST",
            url: "ajax/ImageList.aspx/UpdateImages",
            data: "{}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data) {
                // Newest
                var $newestResults = $('#newest .pcVideomaincontainer:lt(7)');
                $newestResults.fadeOut('slow'), function () {
                    remove()
                };
                $.each($newestResults, function (index, value) {
                    $(this).delay(index * 250).animate({
                        opacity: 0
                    }, 250,

                    function () {
                        $(this).remove();
                        $('#pcContentHolder_newest').append(data.d.Newest.HtmlChannelSegments[index]);
                    });
                });
            });
        }
    });

[注意数字的顺序-这是加载图像的顺序]

在初始页面加载时，第一个图像被加载

　1.在初始页面加载时加载以下图像

1 2 3 4 5 6 7

　2.当用户滚动显示剩余的图像时

1 2 3 4 5 6 7 8 9 10 11

　3.更新脚本第一次运行

8 9 10 11 1 2 3 4 5 6 7

　4.更新脚本第二次运行

4 5 6 7 1 2 3 4 5 6 7

　5.每次更新脚本运行的顺序是

4 5 6 7 1 2 3 4 5 6 7

据我所知，这 4 个新添加的元素未包含在 $('#newest .pcVideomaincontainer:lt(7)')选择中。我不确定在这种情况下如何使用“live”，或者是否有其他技术。

4

2 回答 2

0

我从追加更改为前置，现在可以使用。

于 2012-07-10T22:30:15.080 回答
0

我不确定这是否是您的主要问题，但是您的这部分代码$(this).在 the 之前缺少 aremove()并且还缺少一个结束括号。你有这个：

            var $newestResults = $('#newest .pcVideomaincontainer:lt(7)');
            $newestResults.fadeOut('slow'), function () {
                remove()
            };

应该是这样的：

            var $newestResults = $('#newest .pcVideomaincontainer:lt(7)');
            $newestResults.fadeOut('slow'), function () {
                $(this).remove()
            });

修复此问题后，$newestResults DOM 对象将全部被删除，因此我不确定您为什么然后尝试使用以下代码行再次对它们进行操作。

于 2012-07-07T00:04:13.300 回答