修改js confirm alert 提示框文字

程序员文章站 2022-04-25 12:34:01
...
DOCTYPE html>
html>
head lang="en">
    meta charset="UTF-8">
    style>
        *{padding: 0; margin: 0;}
        html{
            height: 100%;
        }
        body{
            font-size: 16px; font-family: "Microsoft Yahei";  height: 100%; 
        }
        h1,h2,h3{
            font-weight: lighter;
        }
        a{
            text-decoration: none;
        }
        #selfWinsow{
            width: 60%; margin: 0 20%; background: #fff; position: fixed;top: 35%;border: 1px solid #ccc; padding: 0 2% 2% 2%; 
            
        }
        #slefClose{
            width: 25px; height: 25px; position: absolute;right: 1rem; top: 0.4rem; z-index: 9999; cursor: pointer;
        }
        #slefClose::after{
            position: absolute;  width: 30px; height: 30px; content: "×"; font-size: 2.5rem; line-height: 30px;
        }
        #selfWinsow h2{
            font-size: 1rem; border-bottom: 1px solid #ccc; line-height: 100%; padding:1rem 0;
        }
        #selInfo{
            font-size: 0.95rem; line-height: 2.1rem; padding: 0.5rem;
        }
        #selfBtBox{
            padding: 1rem; margin: 0px auto; border: 1px solid #ccc; overflow: hidden;
        }
        .selfBt{
            padding: 0.8rem 2%;background: #323434; color: #fff; float: left; line-height: 100%; text-align: center; cursor: pointer;
        }
        .selfBtDouble{
            width: 46%; 
        }
        .selfBtSingle{
            color: #fff; width: 100%; padding: 0.8rem 0;
        }
        #selfOk{
            background: #323434; 
        }
        .selftalkNo{
            float: left;
            position: relative;
            top: -5px;
            padding: 4px 10px;
            display: inline-block;
            margin-left: 5px;
            color: #000;
        }
        .selftalkOk{
            float: right;
            position: relative;
            top: -5px;
            display: inline-block;
            margin-right: 5px;
            padding: 4px 10px;
            color: #fff;
        }
        #selfNo,#linkTo2{
            background: #eeeeee; color: #555555 
        }
        #selfBack{
            width: 100%; background: rgba(0,0,0,.6);
        }
        #selfInput{
            display: block;
            width: 100%; padding: 0.5rem 0; border: 1px solid #eee; border-radius: 3px; margin-bottom: 1rem; text-indent: 0.6rem
        }
        #selfInput:focus{
            border: 1px solid #087690;
        }

    style>
    title>title>
    script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">script>
    
    script>

        /*
*selfWindow组建，主要是用于模拟移动网站的alert(),confirm()窗口点解某一按钮跳转到某一个页面的效果,
*因为给予移动web，所以没有兼容低版本ie
*调用方法：var win = new SelfWinsow({
*                    types : "confirm",//这里可以选择的参数有，alert,confirm,confirm2,link
*                    slefTitle : "香送网温馨提示",//弹窗标题
*                    selfInfo : "Are you really to remove this tool?",//弹窗信息
*                    selfOk : "YES",//自定义确定按钮文字
*                    selfNo : "NO",//自定义否认按钮文字
*                    callback:fn,//当types为confirm,confirm2或者是talk时的回调函数，confirm为模拟                        
*/

var SelfWinsow = function(settings){this.init(settings)};
SelfWinsow.prototype = {
    init:function(settings){ 
        this.opts = {
            types : "",
            slefTitle : "",
            selfInfo : typeof settings == "string" ? settings : "if have any incorrect , and you will continue?",
            selfOk : "continue operator the deposit",
            selfNo : "back loading page"
        };
        
        this.setting(settings);
        if(typeof settings == "string"){
            this.opts.selfInfo == settings;
        }
        if(settings == "" || settings == undefined || settings == null){
            this.selfAlert();    
        }else if(settings.types == "confirm"){
            this.selfConfirm();
        }else if(settings.types == "confirm2"){
            this.selfConfirm2();
        }else if(settings.types == "link"){
            this.selfLink();
        }else if(settings.types=="talk"){
            this.selfMobileTalk();
        }else{
            this.selfAlert();
        }
    },
    //confirm窗口
    selfConfirm:function(){
        var _this = this;
        var html="
"+_this.opts.slefTitle+""+_this.opts.selfInfo+"
"+_this.opts.selfOk+"
"+_this.opts.selfNo+"";
        this.createMask(html);
        this.selfEvents();
    },
    
    //alert窗口
    selfAlert:function(){
        var _this = this;
        var html="
"+_this.opts.slefTitle+""+_this.opts.selfInfo+"
"+_this.opts.selfOk+"";
        this.createMask(html);
        this.selfEvents();
    },
    selfConfirm2:function(){
        var _this = this;
        var html="

"+_this.opts.slefTitle+""+_this.opts.selfInfo+"
"+_this.opts.selfOk+"";
        this.createMask(html);
        this.selfEvents();
    },
    //带链接窗口
    selfLink:function(){
        var _this = this;
        var html="

"+_this.opts.slefTitle+""+_this.opts.selfInfo+""+_this.opts.selfOk+""+_this.opts.selfNo+"";
        this.createMask(html);
        this.selfEvents();
    },
    
    selfMobileTalk:function(){
        var _this = this;
        var html="

"+_this.opts.selfNo+""+_this.opts.slefTitle+""+_this.opts.selfOk+"";
        this.createMask(html);
        var selfBack = document.getElementById("selfBack");
        selfBack.style.backgroundColor="#eee";
        this.selfEvents();
    },

    //事件处理
    selfEvents:function(){
        this.selfOk();
        var selfNo = document.getElementById('selfNo');
        selfNo && this.slefNo();    
    },

    //确定按钮事件
    selfOk:function(){
        var _this = this;
        var type = this.opts.types;
        var bt=true;
        var selfOk = document.getElementById("selfOk");
        function selfOkFun(e){
            var e = e || window.event;
            var el = e.scrElement || e.target;
            if (el.id == "selfOk" || el.tagName=="IMG") {
                if(type == "alert"){
                    _this.selfRemoveBack();    
                }else if(type == "confirm" || type == "talk" || "confirm2"){
                    if(bt){
                        _this.opts.callback();
                    }else{
                        return false;
                    }
                    _this.selfRemoveBack();
                    bt=false;
                }
                
            }
        }

        document.removeEventListener('click',selfOkFun,false);
        document.addEventListener('click',selfOkFun,false);
        
    },
    //创建背景遮罩
    createMask:function(html){
        var selfBack = document.getElementById("selfBack");

        if(selfBack){
            return false;
        }else{
            var selfBack=document.createElement('div');
            selfBack.id = "selfBac

声明：本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn核实处理。

相关文章
相关视频



html下拉菜单文字怎么变小


HTML里怎么设置thead表头的颜色


html5中元素能拉伸宽度吗


html中怎么清除li黑点


修改js confirm alert 提示框文字




接口与抽象类01


类的composer自动加载机制


composer原理与常用命令03


composer原理与常用命令02





网友评论
文明上网理性发言，请遵守 新闻评论服务协议
我要评论











专题推荐


独孤九贱-php全栈开发教程全栈  170W+
主讲：Peter-Zhu  轻松幽默、简短易学，非常适合PHP学习入门


玉女心经-web前端开发教程入门  80W+
主讲：灭绝师太  由浅入深、明快简洁，非常适合前端学习入门


天龙八部-实战开发教程实战  120W+
主讲：西门大官人 思路清晰、严谨规范，适合有一定web编程基础学习






作者信息




认证0级讲师



发布技术文章


最新文章
热门排行




html中怎么清除li黑点
html下拉菜单文字怎么变小
HTML里怎么设置thead表头的颜色
html的name和value是什么意思
html如何给背景图片设置透明度
html中怎么让列表横向排列
html5怎么创建跳转页尾超链接
十分钟搞懂form标签中的GET和POST提交方式



404 not found是什么意思
DOM是什么意思
url是什么意思？
如何改变图片大小
html是什么
html如何创建电子邮件链接
HTML编辑器有哪些？最好用的4款HTML编辑器推荐
如何制作一个简单的HTML登录页面（附代码）





推荐视频教程

javascript初级视频教程


jquery 基础视频教程




视频教程分类

php视频教程
html视频教程
css视频教程
JS视频教程
jQuery视频教程
mysql视频教程
Linux视频教程
Python视频教程








网站首页 
PHP视频
PHP实战
PHP代码
PHP手册
词条
手记
编程词典
php培训

：公益在线php培训，帮助PHP学习者快速成长！
Copyright 2014-2021 https://www.php.cn/ All Rights Reserved | 苏ICP备2020058653号-1关于我们免责申明赞助与捐赠广告合作