Come posso rilevare quando un elemento di dettagli viene aperto o chiuso in Javascript? Altro che collegare un listener alla funzione click e controllare se l'attributo open è impostato o meno.Rilevamento dell'apertura o della chiusura di un elemento di dettagli
risposta
Si può fare qualcosa di simile:
<details id="element">
<p>Details</p>
</details>
<script>
var isOpen = ($("#element").attr("open") == "open");
alert ("Open = " + isOpen);
</script>
Sto cercando un evento che si attiva quando lo stato cambia da aperto a chiuso o viceversa. – rolisz
C'è un motivo per cui non puoi utilizzare l'evento onclick? Puoi sempre provare il binding sull'evento 'DOMAttrModified'. In entrambi i casi, l'elemento 'details' è così nuovo e non supportato da molti browser, quindi è difficile dire come andrà a finire. –
Bene, se sto usando l'evento onclick, potrei anche usare due div anziché i dettagli e il sommario. Sono solo due righe extra di jQuery e non mi devo preoccupare della compatibilità cross-browser. Non conoscevo DOMAttrModified, ma non penso che funzioni in Chrome e l'elemento detail non funziona in nessun altro posto tranne Chrome :))) – rolisz
È possibile utilizzare il toggle event:
var details = document.querySelector("details")
details.addEventListener("toggle", function() {
details.firstChild.textContent = "done"
})
<!doctype html>
<details>
<summary>toggle event</summary>
</details>
Buono a sapersi che l'evento di commutazione non sembra bubble (?) e che l'attributo 'open' sembra essere modificato * prima * l'evento si attiva. – commonpike
Su Jquery
$("#detail-id").on("toggle", function() {
//code
});
Forse yo hai mai trovato una soluzione a questo? – Bryce