Naar de inhoud
Gratis naslagwerk over HTML
HTML leren en naslaan
Naslag / Attribuut

command HTML attribuut

1 element kent dit attribuut. Klik op een tag voor de volledige uitleg van dat element.

Auteur: Maarten Soetens

Wat doet het command attribuut?

Geeft op <button> aan welke ingebouwde actie wordt uitgevoerd op het element dat via commandfor wordt aangewezen, zoals "show-modal", "close", "request-close", "toggle-popover", "show-popover", "hide-popover", of een eigen waarde die met "--" begint. Onderdeel van de Invoker Commands API; nog een vrij recente toevoeging aan HTML.

HTML 
<button command="show-modal" commandfor="mijn-dialoog">Open dialoog</button>
<dialog id="mijn-dialoog">
  <p>Inhoud van de dialoog.</p>
</dialog>

Welke HTML-elementen kennen command?

<button>

<button>

Het <button>-element van HTML is een interactief element dat door een gebruiker wordt geactiveerd met een muis, toetsenbord, vinger, spraakc...

Specificeert de actie die moet worden uitgevoerd op een element dat wordt bestuurd door een control-<button> die is opgegeven via het commandfor-attribuut. De mogelijke waarden zijn:
  • "show-modal"
    • : De knop toont een <dialog> als modaal venster. Als het dialoogvenster al modaal is, wordt geen actie ondernomen. Dit is een declaratief equivalent van het aanroepen van de HTMLDialogElement.showModal()-methode op het <dialog>-element.
  • "close"
    • : De knop sluit een <dialog>-element. Als het dialoogvenster al gesloten is, wordt geen actie ondernomen. Dit is een declaratief equivalent van het aanroepen van de HTMLDialogElement.close()-methode op het <dialog>-element. Wanneer gebruikt in combinatie met het value-attribuut, wordt de waarde van de knop doorgegeven als de returnValue-eigenschap van het dialoogvenster.
  • "request-close"
    • : De knop activeert een cancel-gebeurtenis op een <dialog>-element om de browser te verzoeken het te sluiten, gevolgd door een close-gebeurtenis. Dit verschilt van het close-commando doordat auteurs Event.preventDefault() kunnen aanroepen op de cancel-gebeurtenis om te voorkomen dat de <dialog> sluit. Als het dialoogvenster al gesloten is, wordt geen actie ondernomen. Dit is een declaratief equivalent van het aanroepen van de HTMLDialogElement.requestClose()-methode op het <dialog>-element. Wanneer gebruikt in combinatie met het value-attribuut van de knop, wordt de waarde doorgegeven als de returnValue-eigenschap van het dialoogvenster.
  • "show-popover"
    • : De knop toont een verborgen popover. Als je probeert een al zichtbare popover te tonen, wordt geen actie ondernomen. Zie Popover API voor meer details. Dit is gelijk aan het instellen van een waarde show voor het popovertargetaction-attribuut, en biedt ook een declaratief equivalent van het aanroepen van de HTMLElement.showPopover()-methode op het popover-element.
  • "hide-popover"
    • : De knop verbergt een zichtbare popover. Als je probeert een al verborgen popover te verbergen, wordt geen actie ondernomen. Zie Popover API voor meer details. Dit is gelijk aan het instellen van een waarde hide voor het popovertargetaction-attribuut, en biedt ook een declaratief equivalent van het aanroepen van de HTMLElement.hidePopover()-methode op het popover-element.
  • "toggle-popover"
    • : De knop schakelt een popover tussen zichtbaar en verborgen. Als de popover verborgen is, wordt hij getoond; als de popover zichtbaar is, wordt hij verborgen. Zie Popover API voor meer details. Dit is gelijk aan het instellen van een waarde toggle voor het popovertargetaction-attribuut, en biedt ook een declaratief equivalent van het aanroepen van de HTMLElement.togglePopover()-methode op het popover-element.
  • Aangepaste waarden
    • : Dit attribuut kan aangepaste waarden bevatten die worden voorafgegaan door twee koppeltekens (--). Knoppen met een aangepaste waarde versturen de CommandEvent naar het bestuurde element.
Alles over <button> →

Andere attributen van deze elementen

value type popovertargetaction popovertarget name interestfor formtarget formnovalidate formmethod formenctype formaction form