未捕获的TypeError：无法读取未定义的属性“top”

Question

我收到此错误。

$.fn.scroller = function(targetid){
this.on('click', function(event) {

            var target = $("#" + this.getAttribute('data-scroll'));

         $('html, body').animate({scrollTop: target.offset().top}, 1000);
    });
    return this;};

Answer 1

offset返回undefined的唯一原因是，如果你在jQuery集上调用它是空的。显然，$("#" + this.getAttribute('data-scroll'))返回了一个空集。

你想要加一个后卫。事实上，我可能会加两个：

$.fn.scroller = function(targetid) {
    this.on('click', function(event) {
        var id = this.getAttribute('data-scroll') || ""; // ***
        if (id) {                                        // ***
            var target = $("#" + id);
            if (target[0]) {                             // ***
                $('html, body').animate({
                    scrollTop: target.offset().top
                }, 1000);
            }                                            // ***
        }
    });
    return this;
};

或更简洁有效：

$.fn.scroller = function(targetid) {
    this.on('click', function(event) {
        var id = this.getAttribute('data-scroll');
        var target = id && document.getElementById(id);
        if (target) {
            $('html, body').animate({
                scrollTop: $(target).offset().top
            }, 1000);
        }
    });
    return this;
};