Прикрепить обработчик события для динамического элемента

Question

Я пытаюсь подключить обработчик событий для динамического элемента, но не удалось.

Вот некоторые из моих кодов. Я хочу, чтобы событие вызывалось динамическим элементом. Возможно, javascript предоставляет функцию поддержки события attach для динамического элемента автоматически, не связывая его снова, например, jQuery live или по методу. Я хочу добавить функциональность, чтобы загружать данные города, в то время как государство или провинция выбраны для Magento Sales> Order> Create New Order Page, не нужно искать правильный файл javascript и пытаться связать событие с ним снова.

 
window.addEventListener('load', function(){ 
    function getCity(){ 
     id= this.selectedIndex; 
     name= this.name; 
     getKota(id, name); 
    } 

    billing_address_region_id= document.getElementsByName('order[billing_address][region_id]'); 
    shipping_address_region_id= document.getElementsByName('order[shipping_address][region_id]'); 

    var event = new Event('change'); 
    billing_address_region_id[0].addEventListener('change', getCity, false); 
    shipping_address_region_id[0].addEventListener('change', getCity, false); 
    billing_address_region_id[0].dispatchEvent(event); 
    shipping_address_region_id[0].dispatchEvent(event); 
}); 

Благодаря тонну

Answer 1

Примечание: Это решение не тестируется.

Что вы можете сделать, так как элементы-мишени добавляются динамически, чтобы зарегистрировать обработчик события изменения на window, а затем посмотреть, активировал ли какой-либо из целевого элемента событие изменения, если это так.

window.addEventListener('change', function (e) { 
    var el = e.target; 
    if (el.name == 'order[billing_address][region_id]' || el.name == 'order[shipping_address][region_id]') { 
     getKota(el.selectedIndex, el.name); 
    } 
}); 

Answer 2

Ваш код будет работать только для уже существующих элементов. Я рекомендую использовать jQuery.

Используя jQuery, вы можете использовать метод «on».

$('#elem').on('change', function(){ 
 
    // Do stuff 
 
});