A RetroSearch Logo

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Search Query:

Showing content from http://developer.mozilla.org/de/docs/Web/API/HTMLDialogElement/close below:

HTMLDialogElement: close() Methode - Web-APIs

HTMLDialogElement: close() Methode

Baseline Widely available

Die close()-Methode der HTMLDialogElement-Schnittstelle schließt das <dialog>. Ein optionaler String kann als Argument übergeben werden, um den returnValue des Dialogs zu aktualisieren.

Syntax
close()
close(returnValue)
Parameter
returnValue Optional

Ein String, der einen aktualisierten Wert für den HTMLDialogElement.returnValue des Dialogs darstellt.

Rückgabewert

Keiner (undefined).

Beispiele

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 auf den X-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, containing a form -->
<dialog id="favDialog">
  <form method="dialog">
    <button id="close" aria-label="close" formnovalidate>X</button>
    <section>
      <p>
        <label for="favAnimal">Favorite animal:</label>
        <select id="favAnimal" name="favAnimal">
          <option></option>
          <option>Brine shrimp</option>
          <option>Red panda</option>
          <option>Spider monkey</option>
        </select>
      </p>
    </section>
    <menu>
      <button type="reset">Reset</button>
      <button type="submit">Confirm</button>
    </menu>
  </form>
</dialog>

<menu>
  <button id="updateDetails">Update details</button>
</menu>
const updateButton = document.getElementById("updateDetails");
const closeButton = document.getElementById("close");
const dialog = document.getElementById("favDialog");
dialog.returnValue = "favAnimal";

function openCheck(dialog) {
  if (dialog.open) {
    console.log("Dialog open");
  } else {
    console.log("Dialog closed");
  }
}

// Update button opens a modal dialog
updateButton.addEventListener("click", () => {
  dialog.showModal();
  openCheck(dialog);
});

// Form close button closes the dialog box
closeButton.addEventListener("click", () => {
  dialog.close("animalNotChosen");
  openCheck(dialog);
});

Wenn der "X"-Button type="submit" wäre, hätte sich der Dialog geschlossen, ohne dass JavaScript erforderlich wäre. Eine Formulareinreichung schließt das <dialog>, in dem es eingebettet ist, wenn die Methode des Formulars dialog ist, sodass kein "Schließen"-Button erforderlich ist.

Ergebnis Spezifikationen Browser-Kompatibilität Siehe auch MDN-Feedback-Box War diese Übersetzung hilfreich?

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