Добавьте событие onclick в div

Я не знаю, разрешено ли это или даже возможно. Возможно ли создать элемент div с событием onclick, так что если в любом месте области div будет нажата кнопка, событие будет запущено.

Eg JAVASCRIPT:

var divTag = document.createElement("div");
divTag.id="new-ID"; 
var onClickCommand = "printWorking()"   //printworking is another method that simply print "I'm working" to the console
divTag.onclick = onClickCommand;
console.log("onclick command added");
console.log(divTag.onclick);
parentDiv.appendChild(divTag); //This simply adds the div tag to the page.

Сгенерировано HTML:

 <!--<div id="new-ID">-->

 whatever content I decide to add to the divTag.innerHTML

Я замечаю, как theres no onclick команда переходит к сгенерированному div. Id это потому, что его не разрешено?

Итак, 2 вопроса.

1: Можно ли добавить onclick в div и вызвать его, если нажимается любая область div. 2: Если да, то почему метод onclick не переходит к моему div.

Как очень странно:

divTag.setAttribute("onclick", "printWorking()");

Выше работает безупречно.

Все ниже не делают и не передают onclick в div.

divTag.onclick=printWorking;

divTag.onclick="printWorking";

divTag.onclick="printWorking()";

Также были опробованы несколько других вариантов.

Ответ 1

Можно ли добавить onclick к div и сделать это, если щелкнуть любую область div.

Да... хотя это следует делать с осторожностью. Убедитесь, что есть какой-то механизм, который позволяет доступ с клавиатуры. Основывайтесь на том, что работает

Если да, то почему метод onclick не проходит через мой div?

Вы присваиваете строку, в которой ожидается функция.

divTag.onclick = printWorking;

Хотя есть более приятные способы назначить обработчики событий, хотя более ранние версии Internet Explorer достаточно отличаются, поэтому для их абстрагирования следует использовать библиотеку. Существует множество очень маленьких библиотек событий, и каждая крупная библиотека jQuery) имеет функцию обработки событий.

Тем не менее, сейчас 2019 год, старые версии Internet Explorer на практике больше не существуют, поэтому вы можете перейти прямо к addEventListener

Ответ 2

Назначьте onclick следующим образом:

divTag.onclick = printWorking;

Свойство onclick не будет принимать строку при назначении. Вместо этого он принимает ссылку на функцию (в этом случае printWorking).
Атрибут onclick может быть строкой при назначении в HTML, например. <div onclick="func()"></div>, но это обычно не рекомендуется.

Ответ 3

Все работает хорошо. Вы не можете использовать divtag.onclick, becease "onclick" атрибут не существует. Сначала вы должны создать этот атрибут, используя .setAttribute(). Посмотрите на это http://reference.sitepoint.com/javascript/Element/setAttribute. Вы должны сначала прочитать документацию, прежде чем начинать давать "-".