Javascript对象文字模式，单击功能不起作用

Question

我是编码和尝试构建我的第一个插件的入门者。 我现在遇到的问题是，当我尝试使用单击功能时，它没有单击（它在测试方法的控制台内部没有显示任何内容）。

这是我的代码

JS

;(function($){
    var exampleObject = {
        init: function() {
            this.cacheDom();
            this.bindEvents();
        },
        cacheDom: function() {
            this.$examplebox = $("#exampleoneid");
            this.$examplebutton = this.$examplebox.find("#button-example");
        },
        bindEvents: function() {
            this.$examplebutton.on('click', this.test.bind(this));
        },
        test: function() {
            console.log("hello");
        }       
    };
    exampleObject.init();
})(jQuery);

HTML

<div id="firstbox">
     <div id="exampleoneid">
         <input type="button" id="button-example">
     </div>
</div>

它在ID后面的页面上执行。 希望有人知道问题/解决方案。