addEventListener () и createElement () - PullRequest
Новая
       36

addEventListener () и createElement ()

2 голосов
/ 06 марта 2020

Я хотел бы спросить, как я могу выполнить addEventListner () для элемента, который я создал с помощью createElement ().

У меня есть кнопка добавления в моем проекте, и когда я нажимаю на нее, она создаст еще одну кнопку добавления и продолжит делать кнопку добавления кнопкой.

, но моя первая кнопка работает и сохраняет Создание новых кнопок, но другие кнопки ничего не делают.

Вот мой код. 

const addBtn = document.querySelector('.button');
const total = document.getElementById('amount-total');



addBtn.addEventListener('click', addButton);


let counter = 0;
function addButton(){
    counter++;

    let newDiv = document.createElement('div');
    newDiv.id = 'new-container' + counter;
    total.parentNode.insertBefore(newDiv, total)


    let createBtn = document.createElement('button');
    createBtn.innerHTML = '+';
    createBtn.className = 'button';

    newDiv.appendChild(createBtn);
}

, но он не сработал, поэтому я попытался вместо этого использовать querySelectorAll. 

const addBtns = document.querySelectorAll('.button');
addBtns.forEach(btn => btn.addEventListener('click', addButton))

, но все же оригинальный работает, но другой нет. Я новичок в javascript, и очень признателен, если вы мне поможете.

Спасибо.

1 Ответ

1 голос
/ 06 марта 2020

Если я правильно понимаю, вы должны добавить addEventListener('click', addButton) в функцию addbutton(). Таким образом, вы также создаете новую кнопку каждый раз, когда нажимаете на добавленную кнопку. Ваш код: 

const addBtn = document.querySelector('.button');
const total = document.getElementById('amount-total');



addBtn.addEventListener('click', addButton);


let counter = 0;

function addButton() {
  counter++;

  let newDiv = document.createElement('div');
  newDiv.id = 'new-container' + counter;
  total.parentNode.insertBefore(newDiv, total)


  let createBtn = document.createElement('button');
  createBtn.innerHTML = '+';
  createBtn.addEventListener('click', addButton); //added this line here!
  createBtn.className = 'button';

  newDiv.appendChild(createBtn);
}

Надеюсь, это поможет вам понять.

...