Baseline Widely available
Die open-Eigenschaft des HTMLDialogElement-Interfaces ist ein boolescher Wert, der das open-HTML-Attribut widerspiegelt und anzeigt, ob das <dialog> zur Interaktion verfügbar ist.
Ein boolescher Wert, der den Zustand des open-HTML-Attributs darstellt. Ein Wert von true bedeutet, dass der Dialog angezeigt wird, während false bedeutet, dass er nicht angezeigt wird.
Warnung: Auch wenn die open-Eigenschaft technisch gesehen nicht schreibgeschützt ist und direkt gesetzt werden kann, wird dies von der HTML-Spezifikation dringend abgeraten, da dies die normalen Dialog-Interaktionen auf unerwartete Weise stören kann. Beispielsweise wird das close-Ereignis nicht ausgelöst, wenn open programmgesteuert auf false gesetzt wird, und nachfolgende Aufrufe der Methoden close() und requestClose() haben keine Wirkung. Stattdessen ist es besser, Methoden wie show(), showModal(), close() und requestClose() zu verwenden, um den Wert des open-Attributs zu ändern.
Das folgende Beispiel zeigt einen einfachen Button, der beim Klicken ein <dialog> mit einem Formular über die showModal()-Methode öffnet. Von dort aus können Sie den Abbrechen-Button klicken, um den Dialog zu schlieÃen (über die HTMLDialogElement.close()-Methode), oder das Formular über den Absenden-Button einreichen.
<!-- Simple pop-up dialog box -->
<dialog id="dialog">
<form method="dialog">
<button type="submit">Close</button>
</form>
</dialog>
<p>
<button id="openDialog">Open Dialog</button>
</p>
<p id="dialogStatus"></p>
const openDialog = document.getElementById("openDialog");
const dialog = document.getElementById("dialog");
const text = document.getElementById("dialogStatus");
function openCheck(dialog) {
if (dialog.open) {
text.innerText = "Dialog open";
} else {
text.innerText = "Dialog closed";
}
}
// Update button opens a modal dialog
openDialog.addEventListener("click", () => {
dialog.showModal();
openCheck(dialog);
});
dialog.addEventListener("close", () => {
openCheck(dialog);
});
<dialog>.Diese Seite wurde automatisch aus dem Englischen übersetzt.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4