<!DOCTYPE html>

 <html>

 <head>

     <meta charset="utf-8"/>

     <title>模拟的confirm</title>

     <link href="css/global.css" rel="stylesheet"/>

   <!--   confirm的重写 -->

    <script type="text/javascript">

     //网页被卷去的上高度

     function EV_myScrollTop(){

         var n=window.pageYOffset

                 || document.documentElement.scrollTop

                 || document.body.scrollTop || 0;

         return n;

     }

     //网页被卷去的左宽度

     function EV_myScrollLeft(){

         var n=window.pageXOffset

                 || document.documentElement.scrollLeft

                 || document.body.scrollLeft || 0;

         return n;

     }

     //网页可见区域宽

     function EV_myClientWidth(){

         var n=document.documentElement.clientWidth

                 || document.body.clientWidth || 0;

         return n;

     }

     //网页可见区域高

     function EV_myClientHeight(){

         var n=document.documentElement.clientHeight

                 || document.body.clientHeight || 0;

         return n;

     }

     function zg(){

         var bgObj=document.getElementById("zg");

         var bgWidth=EV_myClientWidth();

         var bgHeight=EV_myClientHeight();

         var bgTop=EV_myScrollTop();

         var bgLeft=EV_myScrollLeft();

         bgObj.style.position   = "absolute";

         bgObj.style.top        = bgTop+"px";

         bgObj.style.left       = bgLeft+"px";

         bgObj.style.width      = bgWidth + "px";

         bgObj.style.height     = bgHeight + "px";

         //bgObj.style.zIndex     = "-10000";

         bgObj.style.background = "#000";

         bgObj.style.filter     = "progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=60,finishOpacity=60);";

         bgObj.style.opacity    = "0.5";

     }

     function show_cr(){

         if (document.getElementById('show')==null){

             var sh=document.createElement("div");

             sh.setAttribute('class','wrap');

             sh.innerHTML="<div id=\'show\' ><h3 class=\' show-title\'>提示：</h3><p class=\' show-con\'>确定要跳转</p><div class=\'tc\'><a id=\'sure\' class=\'show-btn\'>确定</a><a id=\'qx\' class=\' show-btn\'>取消</a></div></div>";

             document.body.appendChild(sh);

         }

     }

     function zg_cr() {

         var bgObj=document.createElement("div");

         bgObj.setAttribute('id','zg');

         document.body.appendChild(bgObj);

     }

     function dj(url) {

         show_cr();

         zg_cr();

         zg();

        var so=document.getElementById("show");

         var bgObj=document.getElementById("zg");

         so.style.display="block";

        var su =document.getElementById("sure");

         su.onclick =function () {

            window.location.href=url;

         };

       var qx =document.getElementById("qx");

         qx.onclick =function () {

         so.style.display="none";

             document.body.removeChild(bgObj);

         }

  }

 </script>

 <style type="text/css">

 /*confirm的样式*/

 .tc{text-align:center;}

 .wrap{position:fixed;top:35%;left:0;width:100%;z-index: 1000;}

 #show{width:260px;height: 150px;margin: 0 auto;background:#fff;border-radius:10px;}

 .show-title{border-radius:10px 10px 0 0;text-align:center;line-height:40px;background-color:#3586BC;color: #fff;font-weight: normal; }

 .show-con{padding: 10px 0; text-align:center;text-overflow:ellipsis; overflow:hidden; white-space:nowrap; }

 .show-btn{display: inline-block;padding: 5px 25px ;color: #fff;border-radius:5px;border: 2px solid #3586BC;background-color: #3586BC;text-decoration: none;transition: 0.4s;margin: 0 10px;}

 .show-btn:hover{background-color: transparent;color: #3586BC;transition: 0.4s;}

 </style>

 </head>

 <body>

 <button  onclick="dj('https://www.baidu.com')" >确定退出</button>

 </body>

 </html>

模拟的confirm的更多相关文章

  1. 如何模拟alert/confirm/prompt实现阻断程序运行

    场景:在执行js的时候,我们希望运行到某处,进行用户交互,根据交互的内容,运行下面的程序:下面的js程序需要用的和用户交互的内容,所以,和用户交互时,后面的程序必须停止运行 方案: 1. 原生的ale ...

  2. Selenium WebDriver- 操作JavaScript的confirm弹窗

    #encoding=utf-8 import unittest import time from selenium import webdriver from selenium.webdriver i ...

  3. 【webdriver自动化】整理API框架（主要是关键字，具体例子在本地）

    1. 获取网页源码 pageSource = self.driver.page_source print pageSource.encode("gbk","ignore& ...

  4. rabbitmq如何保证消息可靠性不丢失

    目录 生产者丢失消息 代码模拟 事务 confirm模式确实 数据退回监听 MQ事务相关软文推荐 MQ丢失信息 消费者丢失信息 之前我们简单介绍了rabbitmq的功能.他的作用就是方便我们的消息解耦 ...

  5. [转]jQuery插件实现模拟alert和confirm

    本文转自:http://www.jb51.net/article/54577.htm (function () { $.MsgBox = { Alert: function (title, msg) ...

  6. 模拟alert和confirm

    啥也不说,先上图,有图有真相 :) 现在绝大多数网站都不用自带的alert和confirm了,因为界面太生硬了.因此这个插件就这样产生了... 来看插件的实现代码吧: (function () { $ ...

  7. JS模拟Alert与Confirm对话框

    这2个例子都是用原生JS写的,主要是用JS拼接了界面,并未做过多的事件监听.,样式用了Css3的一些特性. 调用方式则为: //Alert Alert.show('我警告你哦~'); //Confir ...

  8. 模拟alert，confirm 阻塞状态

    /*** * 模拟alert弹窗 * content 为弹框显示的内容 * 确定按钮对应的下面取消关闭显示框 * **/function oAlert(content) { var oWrap = $ ...

  9. 自编jQuery插件实现模拟alert和confirm

    现在绝大多数网站都不用自带的alert和confirm了,因为界面太生硬了.因此这个插件就这样产生了自己定制一个的想法...... 啥也不说,先上图,有图有真相 :) 现在绝大多数网站都不用自带的al ...

随机推荐

  1. 项目复审——Alpha阶段

    Deadline: 2018-5-19 10:00PM,以提交至班级博客时间为准. 5.10实验课上,以(1.2班级,3.4班级为单位)进行项目复审.根据以下要求,完成本团队对其他团队的复审排序. 参 ...

  2. map映照容器（常用的使用方法总结）

    map映照容器的数据元素是由一个键值和一个映照数据组成的,键值和映照数据之间具有一一对应的关系.map与set集合容器一样,不允许插入的元素的键值重复. /*关于C++STL中map映照容器的学习,看 ...

  3. Python中的单例模式的几种实现方式的及优化

    单例模式 单例模式(Singleton Pattern)是一种常用的软件设计模式,该模式的主要目的是确保某一个类只有一个实例存在.当你希望在整个系统中,某个类只能出现一个实例时,单例对象就能派上用场. ...

  4. redis缓存工具类，提供序列化接口

    1.序列化工具类 package com.qicheshetuan.backend.util; import java.io.ByteArrayInputStream; import java.io. ...

  5. Redis 缓存设计原则

    基本原则 只应将热数据放到缓存中 所有缓存信息都应设置过期时间 缓存过期时间应当分散以避免集中过期 缓存key应具备可读性 应避免不同业务出现同名缓存key 可对key进行适当的缩写以节省内存空间 选 ...

  6. textarea 滚动条属性设置

    转载:http://www.cnblogs.com/JensonBin/archive/2011/02/23/1962099.html scrollbar属性.样式详解1．overflow内容溢出时的 ...

  7. 学习Memcached:1基本配置与安装

    今天把刚刚学习的到memcached写在博客里,以免以后自己遗忘. 1.首先下载Memcached数据库服务文件,这是我下载好的这个memcached文件. 2.接下来就启动这个exe.通常我需要讲这 ...

  8. SQl语句查询性能优化

    [摘要]本文从DBMS的查询优化器对SQL查询语句进行性能优化的角度出发,结合数据库理论,从查询表达式及其多种查询条件组合对数据库查询性能优化进行分析,总结出多种提高数据库查询性能优化策略,介绍索引的 ...

  9. WCF分布式开发常见错误解决（1）:An error occurred while attempting to find services at...添加服务引用出错

          WCF分布式开发常见错误解决(1):An error occurred while attempting to find services at...添加服务引用出错   当我们在客户端添 ...

  10. JavaScript弹出窗口方法

    本文实例汇总了常用的JavaScript弹出窗口方法,供大家对比参考,希望能对大家有所帮助.详细方法如下: 1.无提示刷新网页: 大家有没有发现,有些网页,刷新的时候,会弹出一个提示窗口,点“确定”才 ...