javascript - 我的 jquery 代码不起作用。为什么？

Question

这是我的 jquery 代码，它不起作用。我真的不知道为什么。请帮助并告诉我如何解决它。

$(function () {
    var panel = function () {
            var init = function () {
                console.log('hello');
            };

        return {
            init: init
        }
    };

    $('.nav li a').on('click', function (e) {
        panel.init();
    });

})();

我在控制台中收到此错误

Object function () {
    var panel = function () {
        var init = function () {
            console.log('hello');
        }
    };

    return {
        init: init
    }
} has no method 'init' 

Answer 1

也许你应该看看如何在 Javascript 中定义一个类：

http://www.phpied.com/3-ways-to-define-a-javascript-class/

var panel = {
    init: function () {
        alert("Hello!");
    }
}

panel.init();

---

$('.nav li a').on('click', function (e) {
    panel.init();
    e.preventDefault();
});

Answer 2

我认为您缺少面板函数声明末尾的括号。

var panel = function () {
    var panel = function () {
        var init = function () {
            console.log('hello');
        }
    };

    return {
        init: init
    }
}();

确保右大括号后面是()

Answer 3

您的 init 函数位于另一个函数面板中。这是从外面无法到达的。当您想返回 init 方法时，如果您知道我的意思，则必须将 init 函数提高一个级别。

Answer 4

我猜该面板应该使用立即调用：

$(function () {
    var panel = (function () {
            var init = function () {
                console.log('hello');
            };

        return {
            init: init
        }
    })();

    $('.nav li a').on('click', function (e) {
        panel.init();
    });

})();

代码将立即执行并将对象返回给panel变量。因此panel选择了一个init财产。

Answer 5

我会这样做：

$(function () {
    var panel = {
        init: function () {
            console.log('hello');
        }
    }

    $('.nav li a').on('click', function (e) {
        panel.init();
    });
});​

小提琴

看起来更像你想要做的？

Answer 6

在这种情况下 panel 是一个回调，这个回调返回另一个回调init，所以你必须把 () 放在两个回调周围，试试这个：

$(function () {
    var panel = function () {
        var init = function () {
            console.log('hello');
        };

        return {
            init: init
        }
    };

    $('.nav li a').on('click', function (e) {
        panel().init();
    });

})();