Javascript DOM HTML Dialog showModal() Method

Introduction

Show a dialog window: 

document.getElementById("myDialog").showModal();

Click the button to show the dialog.

Use the "Esc" button/key to close the modal.

View in separate window 

<!DOCTYPE html>
<html>
<body>
<button onclick="myFunction()">Show dialog</button>
<dialog id="myDialog">This is a dialog window</dialog>

<script>
function myFunction() {//from   www . j av a2  s. c om
  document.getElementById("myDialog").showModal();
}
</script>

</body>
</html>

The showModal() method shows the dialog.

When showModal() method is called, the user cannot interact with other elements on the page.

Using the show() method allows the user to interact with other elements on the page.




PreviousNext

Related