js 三种弹出框 alert confirm prompt

最新推荐文章于 2025-08-12 11:41:22 发布

原创最新推荐文章于 2025-08-12 11:41:22 发布 · 491 阅读

1 ·

本内容遵循CC 4.0 BY-SA版权协议

js 专栏收录该内容

18 篇文章

订阅专栏

本文详细介绍了JavaScript中三种常用的弹出框：警告框alert()、确认框confirm()和输入框prompt()。通过实例展示了每种弹窗的功能及使用场景，如修改按钮样式和密码验证。

js 三种弹出框 alert confirm prompt

第一种，警告框 alert(),最常见的弹出框

<button onclick="alert('我是第一种弹出框')">我是第一种弹出框alert()</button>

第二种 confirm()

<button onclick="change()">我是第二种弹出框confirm()</button>
//第二种弹出框 fonfirm()
function change(){
    if(confirm('你确定要修改所有button的背景颜色么')){
        var buttons = document.getElementsByTagName('button');
            for(var i=0;i<buttons.length;i++){
            buttons[i].style.background = 'red';
        buttons[i].style.color = '#Fff';
    }
    }else{
        console.log('000');
    }
}

第三种弹出框 prompt() 有两个参数，第一个参数表示对话框中显示的传文本，第二个参数是默认输入的文本

<button onclick="change2()">我是第三种弹出框prompt()</button>
//第三种弹出框 prompt()
function change2(){
if(prompt('请输入正确的密码')=='123456'){
    alert('密码输入正确，然而并没什么卵用');
}else{
    alert('密码输入错误，网页即将关闭');
    setTimeout(function(){
    //2秒后关闭当前页面
    window.opener=null;
    window.open('','_self');
                                                                                                                                                                                                                                                                                                                                                                                            
    window.close();
    },2000)
}
}