Функция JavaScript вызывается до нажатия кнопки

Question

У меня есть jsfiddle код. То, что я есть, у меня есть объект Cal, который состоит из функции init и другого объекта с именем Event. Внутри Event У меня есть две функции: init и show. То, что я делаю, - это вызов функции init объекта Cal и прохождение параметра там. Внутри этой функции init я вызываю функцию Eventinit и передаю этот же параметр здесь. и внутри этого init функция Я звоню show функция внутри Event, когда пользователь нажимает на ссылку .button, которая показывает param в консоли. Но когда я запускаю этот код, он показывает param на консоли, прежде чем нажимать .button. Почему и как я могу заставить его работать, чтобы он отображал параметр, когда я нажимаю кнопку .button?

Вот мой код

var Cal = { 
    init: function (param) { 
     this.param = param; 
     Cal.Event.init(this.param); 
    }, 

    func: function() {}, 

    Event: { 
     init: function (param) { 
      $('.button').on('click', this.show(param)); 
     }, 

     show: function (param) { 
      console.log(param); 
     } 
    } 
} 

Cal.init('para'); 

Answer 1

В этой строке кода:

init: function (param) { 
    $('.button').on('click', this.show(param)); 
}, 

Вы являетесь , вызываяshow, а затем передавая его возвращаемое значение в on, поэтому он запускается при вызове Cal.Event.init. Вы не указываете код on для вызова при нажатии. Чтобы сделать это, поместите его в функции обработчика событий:

init: function (param) { 
    $('.button').on('click', function() { 
     Cal.Event.show(param); 
    }); 
}, 

Обратите внимание, что я изменил this к Cal.Event потому что в вызове функции обработчика, this будет ссылка на эту кнопку, а не Cal.Event.

Answer 2

.он() ожидают параметр 2 является функцией, а не возвращаемое значение этой функции

$('.button').on('click', function() { 
    // Here this points to the button DOM object. 
    Cal.Event.show(param) 
}); 

Answer 3

Вы сразу вызываете this.show(param). Измените его следующим образом:

init: function (param) { 
    $('.button').on('click', $.proxy(function() { 
     this.show(param); 
    }, this)); 
}, 

http://jsfiddle.net/9SLEX/3/