欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

js 三种弹出框 alert confirm prompt

程序员文章站 2022-03-02 12:41:01
...

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)
}
}