Почему мой делегированный обработчик событий не работает?

Question

У меня есть кнопка с идентификатором Strike, но событие JQUERY похоже не работает? Это событие работало ранее, но ТОЛЬКО, если кнопка существовала при загрузке DOM.

dom.el('Strike').onclick = strikeSkill; 

Теперь у меня есть кнопки, динамически генерируемые, поэтому кнопка «Удар» создается позже. Таким образом, предыдущий код выше не работает, потому что Strike = Null.

Я использую функцию JQuery .on, заполнил свои аргументы, но теперь, когда я нажимаю кнопку «Пуск», ничего не происходит. Нет атаки. Почему это?

function strikeSkill() { 
    activeCheck(); 
    if (upgradeActive == true){ 
     radialSelector(strike); 
    } 
    if (upgradeActive == false){ 
     HitCalc(player.cc, monster.cc); 
     actor.expCounter(player.cc); 
     actor.balanceCounter(player.cc, monster.cc); 
    } 
}; 

$('#Strike').on('click', '#Strike', function() { 
    strikeSkill(); 
}); 

Answer 1

Ваш текущий обработчик события ищет #Strike элемента в#Strike, что неверно (не говоря уже будет недействительным HTML).

Вы можете исправить это с помощью статического родительского элемента для первичного выбора:

$(document).on('click', '#Strike', function(){ 
    strikeSkill(); 
}); 

В примере я использовал document, однако для лучшей производительности он должен быть ближайший статический родительский элемент #Strike, который доступный при загрузке DOM.