A RetroSearch Logo

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

Search Query:

Showing content from https://developer.cdn.mozilla.net/ja/docs/Web/API/HTMLDialogElement/open below:

HTMLDialogElement: open プãƒãƒ‘ティ - Web API

HTMLDialogElement: open プロパティ

Baseline Widely available

open は HTMLDialogElement インターフェイスのプロパティで、HTML の open 属性を反映した論理値です。これは <dialog> が操作できる状態であるかどうかを示します。

値

論理値で、HTML の open 属性の状態を表します。true は設定されており、従ってダイアログは表示されています。false は設定されておらず、従ってダイアログは表示されていません。

このプロパティは読み取り専用になりました。プログラムにより値を設定してダイアログを表示または非表示にすることは可能です。

例

以下の例では、クリックするとフォームを含む <dialog> を showModal() メソッドで開くための単純なボタンを示しています。 そこから Cancel ボタンをクリックしてダイアログを閉じたり(HTMLDialogElement.close() メソッドで)、送信ボタンでフォームを送信したりすることができます。

<!-- 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>

<script>
  (() => {
    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);
    });
  })();
</script>
結果 仕様書 ブラウザーの互換性 関連情報

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