javascript - Bezüglich der Probleme, die bei der Verwendung von jquery.lazyload aufgetreten sind, helfen Sie bitte!

Question

Ich habe festgestellt, dass dieses Plug-in anscheinend keine dynamisch eingefügten Elemente verarbeitet, was bedeutet, dass dynamisch eingefügte Elemente nicht normal angezeigt werden können, sondern immer das Ladebild angezeigt wird. Meine aktuelle temporäre Lösung besteht darin, dem neu eingefügten Knoten ein eindeutiges Element hinzuzufügen .container, und initialisieren Sie den Container. Können Sie etwas tun?

            var index = 0;
            var tpl = $("#template").text();
            $('#addItem').on('click', function () {
                var html = render(tpl, item);

                var $container = $('<p id="newItem' + index++ + '"></p>');

                $('body').append($container.html(html));

                $container.find("img.lazy").lazyload({
                    effect: "fadeIn",
                    load: function (index, elem) {
                        $(this).parent('.box').css('background', '#fff');
                    }
                });

            });

Answer 1

这不是挺好么。。。

lazyload不是监听，自然不能对后插入的元素生效。。。

Answer 2

找到更好的解决方案了，直接将挂钩lazy去掉，就可以了

            $("img.lazy").lazyload({
                effect: "fadeIn",
                load: function (index, elem) {
                    $(this).parent('.box').css('background', '#fff').find('img').removeClass('lazy');
                }
            });

Answer 3

动态添加，添加完了对新添加的元素加个 .loadlazy() 不行吗？

https://jsfiddle.net/06rcojjd/