dialog

by lv san

HTML

<dialog>
  <form method="dialog">
    <p>确定 or 取消</p>
    <button type="submit" value="yes">确定</button>
    <button type="submit" value="no">取消</button>
  </form>
</dialog>

CSS

dialog::backdrop {
  background: rgba(0, 0, 0, 0.6)
}

JavaScript

var dialog = document.querySelector('dialog')
dialog.showModal()
dialog.addEventListener('close', function(event) {
  alert(dialog.returnValue)
})