Как добавить прослушиватель событий onclick к созданному элементу кнопки в Javascript? - PullRequest
Новая
       80

Как добавить прослушиватель событий onclick к созданному элементу кнопки в Javascript?

0 голосов
/ 08 апреля 2020

Я пытаюсь создать динамическую c веб-страницу MadLibs. На главной странице пользователь может выбрать между 3 историями для создания MadLibs, и когда они нажимают кнопку, страница меняется, где они вставляют свои существительные, прилагательные и т. Д. c. в полях ввода текста. Затем они должны нажать кнопку, чтобы заменить исходные слова в истории словами, которые они вводят.

Кнопка на второй странице, которую я создаю и добавляю на страницу, но по какой-то причине я хочу прослушивателя событий onclick прикрепить к нему, что вызывает функцию замены слов, не будет прикрепляться к элементу кнопки.

Ниже приведен код, в котором я создаю элемент кнопки и добавляю его в тело документа. Созданная мной функция, которая заменяет слова в истории, называется subWords (). 

          var addb = document.createElement("button");
          addb.innerHTML = "Add Words!";
          addb.id = "addb";
          addb.value = "addb";
          document.body.appendChild(addb);
          document.getElementById("addb").addEventListener('click',subWords);

Я пробовал так много разных вещей, в том числе: 

addb.onclick = subWords;

, прежде чем добавить кнопку к телу, 

addb.onclick = function(){subWords};

addb.onclick = function(){subWords()};

addb.onclick = function(){subWords;};

и почти все другие комбинации, которые я могу найти на этом сайте. Никто из них не работает на меня !!

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

1 Ответ

0 голосов
/ 08 апреля 2020

Итак, вы можете добавить к родителю, используя HTML DOM, не создавая elemnt. 

(parentElemnt).innerHTML += `<button value="addb" id="addb" onclick="subWords">Add Words!</button>`;

+ = добавит то, что находится внутри `` ... Вместо того, чтобы создавать и добавлять, а затем присваивать значения, вы можете сделать это одной строкой. Выберите родительский элемент с помощью DOM, а затем замените его внутри

(parentElement)

.

Проверьте, сработало ли это, и удачи. Прошу прощения за то, что не включил кодекс лучших практик. Если бы вы могли поделиться всем своим кодом, я был бы рад проверить, как исправить, не добавляя элемент.

Lasal.

...