JavaScript 练手小技巧:HTML5 的 dialog 标签制作对话框_dialog html-CSDN博客
<dialog id="dialog">
<h2 align="center">修改</h2>
<input type="text" id="title1" placeholder="标题" value=""><p>
<input type="text" id="website1" placeholder="https://" value="https://"><p>
<center><button id="button_modify_confirm">确定</button> <button id="button_modify_cancel">取消</button></center>
</dialog>
Modal 模式可以按 ESC 关闭 dialog
menu_modify.addEventListener('click', function(){
menu.style.display = 'none';
dialog.showModal();
});
点击 dialog 外部区域关闭窗口文章来源:https://www.toymoban.com/news/detail-796717.html
dialog.addEventListener("click", function(e){
if (e.target.nodeName.toLowerCase() == "dialog") {
this.close();
}
});
按钮关闭窗口 文章来源地址https://www.toymoban.com/news/detail-796717.html
button_modify_cancel.addEventListener("click", function(e){
dialog.close();
});
到了这里,关于HTML5:dialog的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!