javascript - 如何修复 :"Cannot read property ' init' of undefined TypeError”？

Question

我使用 Jquery-3.2.1，Jquery-Ui 1.12.1。在我的 JavaScript 文件中:

window.TruyenOnlineScript = (function () {
    var _this = {};

    _this.init = function () {
        _this.initSearchMobile();
        _this.initSidebar();
    };   

    _this.initSearchMobile = function () {
        //Open Input Search Mobile
        $('.js-open-search-box-mobile').on('click', function (event) {
            event.preventDefault();
            $('body').addClass('open-search-box');
            setTimeout(function () {
                $('#js-search-input-mobile').focus()
            }, 500);
        });
    };

    _this.initSidebar = function () {
        //Open Navbar Moblie
        $('.js-open-sidebar').on('click', function (event) {
            event.preventDefault();
            event.stopPropagation();
            $('body').addClass('open-sidebar');
        });
    };

})();

$('document').ready(function () {
    window.TruyenOnlineScript.init();
});

但我收到错误“init of undefined”:

谁能告诉我如何解决它？谢谢!

Answer 1

您正在将 window.TruyenOnlineScript 设置为立即调用的函数表达式的返回值:

window.TruyenOnlineScript = (function () {
   . . .
})();

但该表达式不返回任何值，因此 window.TruyenOnlineScript 最终变为 undefined(这就是为什么您不能调用 init() 在 undefined 上)。

您需要让 IIFE 返回一个对象供 TruyenOnlineScript 引用。

window.TruyenOnlineScript = (function () {
    var _this = {};

    _this.init = function () {
        _this.initSearchMobile();
        _this.initSidebar();
    };   

    _this.initSearchMobile = function () {
        //Open Input Search Mobile
        $('.js-open-search-box-mobile').on('click', function (event) {
            event.preventDefault();
            $('body').addClass('open-search-box');
            setTimeout(function () {
                $('#js-search-input-mobile').focus()
            }, 500);
        });
    };

    _this.initSidebar = function () {
        //Open Navbar Moblie
        $('.js-open-sidebar').on('click', function (event) {
            event.preventDefault();
            event.stopPropagation();
            $('body').addClass('open-sidebar');
        });
    };
    
    return _this; // <-- Now this will be returned

})();

$('document').ready(function () {
    window.TruyenOnlineScript.init();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>