Question

我在插件中有多个函数，我想通过调用，但由于某些原因，我得到方法未定义。

如果我不使用方法来包装我得到的函数

函数语句需要名称

我在这里做错了什么？

我是否需要使用var？

方法包装函数

(function ($) {

var methods = {

    // GET TARGET LOCATION AND ANIMATE
    scrollTopPage: function () {

        $(htmlBody).animate({
            scrollTop: 0
        }, 'slow');

    },

    scrollToSect: function (htmlBody) {

        $(htmlBody).animate({

            scrollTop: $('#page-id').offset().top
        });

    },

    goToID: function (sectID) {

        var htmlBody = 'html,body';

        //Scroll to the very top
        if (sectID == 'home') {

            methods.scrollTopPage(htmlBody);

        } else {


            methods.scrollToSect(htmlBody);

        }

    }

} // End the Methods/Functions


$.fn.pageScroller = function (methods) {


    this.click(function (e) {

        sectID = $(this).attr('id');

            e.preventDefault();

            // Undefined Error
            methods.goToID(sectID); // Call the goToID function and pass the sectID variable

                $(this).parent().addClass('current').prev().removeClass('current');
                $(this).parent().addClass('current').next().removeClass('current');


    });

    $(document).keydown(function (e) {

        //To Do Re Use the methods/functions here

    });

};

})(jQuery);

Answer 1

您正在分配变量，而不是在以下位置调用该函数：

 $.fn.pageScroller = function (methods) { ....

我想这会导致函数实际从$.fn.pageScrollerplugin调用，或者调用它时，参数将被命名为methods，但不会是您创建的方法对象。相反，它将是调用者选择作为参数传递的任何内容。在您的情况下，似乎根本没有传递任何参数。这就是为什么methods是undefined。

如果您没有为此函数设置参数，是否会导致methods引用您的函数集合而不是传递参数？

即：试试这个，希望methods仍可访问：

 $.fn.pageScroller = function () { ....

Answer 2

另一种方法是在插件中设置methods属性，就像这样...

(function ($) {

$.fn.pageScroller = function () {

  this.methods = {

    // GET TARGET LOCATION AND ANIMATE
    scrollTopPage: function () {

        $(htmlBody).animate({
            scrollTop: 0
        }, 'slow');

    },

    scrollToSect: function (htmlBody) {

        $(htmlBody).animate({

            scrollTop: $('#page-id').offset().top
        });

    },

    goToID: function (sectID) {

        var htmlBody = 'html,body';

        //Scroll to the very top
        if (sectID == 'home') {

            methods.scrollTopPage(htmlBody);

        } else {


            methods.scrollToSect(htmlBody);

        }

    }

} // End the Methods/Functions



    this.click(function (e) {

        sectID = $(this).attr('id');

            e.preventDefault();

            // Undefined Error
            methods.goToID(sectID); // Call the goToID function and pass the sectID variable

                $(this).parent().addClass('current').prev().removeClass('current');
                $(this).parent().addClass('current').next().removeClass('current');


    });

    $(document).keydown(function (e) {

        //To Do Re Use the methods/functions here

    });

};

})(jQuery);

或者您也可以在创建插件时传递方法...

在jquery插件中调用多个函数

2 个答案: