HTML ontoggle Attribute - HTML Attribute

Definition and Usage

The ontoggle attribute fires when the user opens or closes a <details> element.

The <details> element specifies additional details that the user can view or hide on demand.

Applies to

The ontoggle attribute is part of the Event Attributes, and can be used on the following element:

Elements	Event
<details>	ontoggle

Browser Support

The numbers in the table specify the first browser version that fully supports the event attribute.

How to Execute a JavaScript when a <details> element is opened or closed - HTML ontoggle Attribute

Click on Arrow to Open the details System HTML Code.

index.html

Example: HTML


<!DOCTYPE html>
<html>
<body>
<p>Open the details.</p>
<details ontoggle="myFunction()">
<summary>Copyright 1999-2014.</summary>
<p> - by Refsnes Data. All Rights Reserved.</p>
<p>All content and graphics on this web site are the property of the company Refsnes Data.</p>
</details>
<script>
function myFunction() { alert("The ontoggle event occured");
}
</script>
</body>
</html>

Output should be:

html ontoggle attribute

HTML accept Attribute HTML Input	HTML Attribute
HTML accept-charset Attribute	HTML Attribute
HTML accesskey Attribute	HTML Attribute
HTML action Attribute	HTML Attribute
HTML alt Attribute	HTML Attribute
HTML async Attribute	HTML Attribute
HTML autocomplete Attribute in HTML	HTML Attribute
HTML autofocus Attribute	HTML Attribute
HTML autoplay Attribute	HTML Attribute
HTML charset Attribute	HTML Attribute
HTML checked Attribute	HTML Attribute
HTML cite Attribute	HTML Attribute
HTML class Attribute	HTML Attribute
HTML cols Attribute	HTML Attribute
HTML colspan Attribute	HTML Attribute
HTML content Attribute	HTML Attribute
HTML contenteditable Attribute	HTML Attribute
HTML controls Attribute	HTML Attribute
HTML coords Attribute	HTML Attribute
HTML data Attribute	HTML Attribute
HTML data-* Attribute	HTML Attribute
HTML datetime Attribute	HTML Attribute
HTML controls Attribute	HTML Attribute
HTML default Attribute	HTML Attribute
HTML defer Attribute	HTML Attribute
HTML dir Attribute	HTML Attribute
HTML dirname Attribute	HTML Attribute
HTML disabled Attribute	HTML Attribute
HTML download Attribute	HTML Attribute
HTML draggable Attribute	HTML Attribute
HTML enctype Attribute	HTML Attribute
HTML enterkeyhint Attribute	HTML Attribute
HTML for Attribute	HTML Attribute
HTML form Attribute	HTML Attribute
HTML formaction Attribute	HTML Attribute
HTML headers Attribute	HTML Attribute
HTML height Attribute	HTML Attribute
HTML hidden Attribute	HTML Attribute
HTML high Attribute	HTML Attribute
HTML href Attribute	HTML Attribute
HTML hreflang Attribute	HTML Attribute
HTML http-equiv Attribute	HTML Attribute
HTML id Attribute	HTML Attribute
HTML inert Attribute	HTML Attribute
HTML inputmode Attribute	HTML Attribute
HTML ismap Attribute	HTML Attribute
HTML kind Attribute	HTML Attribute
HTML label Attribute	HTML Attribute
HTML lang Attribute	HTML Attribute
HTML list Attribute	HTML Attribute
HTML loop Attribute	HTML Attribute
HTML low Attribute	HTML Attribute
HTML max Attribute	HTML Attribute
HTML maxlength Attribute	HTML Attribute
HTML media Attribute	HTML Attribute
HTML method Attribute	HTML Attribute
HTML min Attribute	HTML Attribute
HTML multiple Attribute	HTML Attribute
HTML muted Attribute	HTML Attribute
HTML name Attribute	HTML Attribute
HTML novalidate Attribute	HTML Attribute
HTML onabort Attribute	HTML Attribute
HTML onafterprint Attribute	HTML Attribute
HTML onbeforeprint Attribute	HTML Attribute
HTML onbeforeunload Attribute	HTML Attribute
HTML onblur Attribute	HTML Attribute
HTML oncanplay Attribute	HTML Attribute
HTML oncanplaythrough Attribute	HTML Attribute
HTML onchange Attribute	HTML Attribute
HTML onclick Attribute	HTML Attribute
HTML oncontextmenu Attribute	HTML Attribute
HTML oncopy Attribute	HTML Attribute
HTML oncuechange Attribute	HTML Attribute
HTML oncut Attribute	HTML Attribute
HTML ondblclick Attribute	HTML Attribute
HTML ondrag Attribute	HTML Attribute
HTML ondragend Attribute	HTML Attribute
HTML ondragenter Attribute	HTML Attribute
HTML ondragleave Attribute	HTML Attribute
HTML ondragover Attribute	HTML Attribute
How to add HTML ondragstart Attribute	HTML Attribute
HTML ondrop Attribute	HTML Attribute
HTML ondurationchange Attribute	HTML Attribute
HTML onemptied Attribute	HTML Attribute
HTML onended Attribute	HTML Attribute
HTML onerror Attribute	HTML Attribute
HTML onfocus Attribute	HTML Attribute
HTML onhashchange Attribute	HTML Attribute
HTML oninput Attribute	HTML Attribute
HTML oninvalid Attribute	HTML Attribute
HTML onkeydown Attribute	HTML Attribute
HTML onkeypress Attribute	HTML Attribute
HTML onkeyup Attribute	HTML Attribute
HTML onload Attribute	HTML Attribute
HTML onloadeddata Attribute	HTML Attribute
HTML onloadedmetadata Attribute	HTML Attribute
HTML onloadstart Attribute	HTML Attribute
HTML onmousedown Attribute	HTML Attribute
HTML onmousemove Attribute	HTML Attribute
HTML onmouseout Attribute	HTML Attribute
HTML onmouseover Attribute	HTML Attribute
HTML onmouseup Attribute	HTML Attribute
HTML onmousewheel Attribute	HTML Attribute
HTML onoffline Attribute	HTML Attribute
HTML ononline Attribute	HTML Attribute
HTML onpageshow Attribute	HTML Attribute
HTML onpaste Attribute	HTML Attribute
HTML onpause Attribute	HTML Attribute
HTML onplay Attribute	HTML Attribute
HTML onplaying Attribute	HTML Attribute
HTML onprogress Attribute	HTML Attribute
HTML onratechange Attribute	HTML Attribute
HTML onreset Attribute	HTML Attribute
HTML onresize Attribute	HTML Attribute
HTML onscroll Attribute	HTML Attribute
HTML onsearch Attribute	HTML Attribute
HTML onseeked Attribute	HTML Attribute
HTML onseeking Attribute	HTML Attribute
HTML onstalled Attribute	HTML Attribute
HTML onsubmit Attribute	HTML Attribute
HTML onsuspend Attribute	HTML Attribute
HTML ontimeupdate Attribute	HTML Attribute
HTML ontoggle Attribute	HTML Attribute
HTML onunload Attribute	HTML Attribute
HTML onvolumechange Attribute	HTML Attribute
HTML onwaiting Attribute	HTML Attribute
HTML onwheel Attribute	HTML Attribute
HTML open Attribute	HTML Attribute
HTML optimum Attribute	HTML Attribute
HTML pattern Attribute	HTML Attribute
HTML placeholder Attribute	HTML Attribute
HTML popover Attribute	HTML Attribute
HTML popovertarget Attribute	HTML Attribute
HTML popovertargetaction Attribute	HTML Attribute
HTML poster Attribute	HTML Attribute
HTML preload Attribute	HTML Attribute
HTML readonly Attribute	HTML Attribute
HTML rel Attribute	HTML Attribute
HTML required Attribute	HTML Attribute
HTML reversed Attribute	HTML Attribute
HTML rows Attribute	HTML Attribute
HTML rowspan Attribute	HTML Attribute
HTML sandbox Attribute	HTML Attribute
HTML scope Attribute	HTML Attribute
HTML selected Attribute	HTML Attribute
HTML shape Attribute	HTML Attribute
HTML size Attribute	HTML Attribute
HTML sizes Attribute	HTML Attribute
HTML span Attribute	HTML Attribute
HTML spellcheck Attribute	HTML Attribute
HTML src Attribute	HTML Attribute
HTML srcdoc Attribute	HTML Attribute
HTML srclang Attribute	HTML Attribute
HTML <source> srcset Attribute	HTML Attribute
HTML start Attribute	HTML Attribute
HTML step Attribute	HTML Attribute
HTML style Attribute	HTML Attribute
HTML tabindex Attribute	HTML Attribute
HTML target Attribute	HTML Attribute
HTML title Attribute	HTML Attribute
HTML translate Attribute	HTML Attribute
HTML type Attribute	HTML Attribute
HTML usemap Attribute	HTML Attribute
HTML value Attribute	HTML Attribute
HTML width Attribute	HTML Attribute
HTML wrap Attribute	HTML Attribute

Single Articles

How to Execute a JavaScript when a <details> element is opened or closed - HTML ontoggle Attribute

HTML Attribute

Type :	Develop
Category :	Web Tutorial
Sub Category :	HTML Attribute
Uploaded by :	Admin

Read Article

https://horje.com/learn/1434/reference