Обнаружение открытия или закрытия элемента данных

Как определить, когда элемент данных открывается или закрывается в Javascript? Помимо прикрепления слушателя к функции щелчка и проверки, установлен ли атрибут open или нет.

Ответ 1

Вы можете сделать что-то вроде этого:

<details id="element">
   <p>Details</p>
</details>

<script>
   var isOpen = ($("#element").attr("open") == "open");

   alert ("Open = " + isOpen);
</script>

Ответ 2

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

var details = document.querySelector("details")

details.addEventListener("toggle", function() {
 details.firstChild.textContent = "done"
})

<!doctype html>
<details>
 <summary>toggle event</summary>
</details>

Ответ 3

В jQuery вы можете поймать событие, используя .on('toggle') следующим образом:

$('#detail-id').on('toggle', function() {
   //code
});