Как сделать всплывающее окно на js?

Question

[Ivan Ivanovich]

Допустим, у меня есть кнопка:

<button>Text</button>

И по нажатию на эту кнопку должно появиться окно с текстом и кнопкой "далее".

Answer 1

[Алексей Ярков]

Например сделайте так, как описано здесь:

<!-- Простой попап диалог с формой -->
<dialog id="favDialog">
  <form method="dialog">
    <section>
      <p><label for="favAnimal">Favorite animal:</label>
        <select id="favAnimal">
          <option></option>
          <option>Brine shrimp</option>
          <option>Red panda</option>
          <option>Spider monkey</option>
        </select></p>
    </section>
    <menu>
      <button id="cancel" type="reset">Cancel</button>
      <button type="submit">Confirm</button>
    </menu>
  </form>
</dialog>

<menu>
  <button id="updateDetails">Update details</button>
</menu>

(function() {
  const updateButton = document.getElementById('updateDetails');
  const cancelButton = document.getElementById('cancel');
  const favDialog = document.getElementById('favDialog');

  // Update button opens a modal dialog
  updateButton.addEventListener('click', function() {
    favDialog.showModal();
  });

  // Form cancel button closes the dialog box
  cancelButton.addEventListener('click', function() {
    favDialog.close();
  });
})();