jquery - 添加新的 DOM 元素后，航路点不适用于新元素，仅适用于旧元素？

Question

这是我尝试过的，即使我尝试过也无法正常工作

$(document).ready(function () {
    $('.entry-item').waypoint(function (direction) {
        if (direction === "down") {
            $(this).children(".sticky-items").css({
                "position": "fixed",
                "top": "45px",
                "right": "0px"
            });
        } else if (direction === "up") {
            $(this).children(".sticky-items").removeAttr("style");
        }
    }, {
        offset: 5
    });
    window.addmore = function () {
        var $newdiv1 = $('<div class="entry-item"><div class="sticky-items">STICK XX</div><div>');
    $('#entries').append($newdiv1);
        $.waypoints('refresh');
}
});

$.waypoints('refresh') 需要帮助！

http://jsfiddle.net/VxqNa/9/

Answer 1

您也应该在动态添加的元素上重新初始化航点：

演示

var initwaypoint = function (direction) {
        if (direction === "down") {
            $(this).children(".sticky-items").css({
                "position": "fixed",
                "top": "45px",
                "right": "0px"
            });
        } else if (direction === "up") {
            $(this).children(".sticky-items").removeAttr("style");
        }
    };

$(document).ready(function () {
    $('.entry-item').data('waypoint',true).waypoint(initwaypoint, {
        offset: 5
    });
    window.addmore = function () {
        var $newdiv1 = $('<div class="entry-item"><div class="sticky-items">STICK XX</div></div><div><div class="entry-item"><div class="sticky-items">STICK XX</div><div>');
    $('#entries').append($newdiv1);
        $('.entry-item').filter(function(){
            return !$(this).data('waypoint')
        }).data('waypoint',true).waypoint(initwaypoint, {
        offset: 5
    });

}
});