首先,做一个简单的div弹出层用于测试,该弹出层的介绍可查看本博客另一篇博文:【JS新手教程】浏览器弹出div层

然后加入LODOP内嵌,LODOP可以内嵌,C-LODOP不能内嵌,可以在IE等浏览器下查看内嵌效果。
如图,在这个做的简单弹出层的代码基础上,加了LODOP内嵌和一个文本框,当文本框的内容为空的时候,显示弹出层,不为空的时候显示打印设计内嵌。

被遮挡的原代码:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>WEB打印控件LODOP</title>
<script language="javascript" src="LodopFuncs.js"></script>
<style>
.buledivv{display:none;position:absolute;top:20%;left:20%;width:400px;height:200px;background-color:#7da0e1;z-index:10000;}
</style>
</head> <body>
<object id="LODOP1" classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" width=410 height=307>
<param name="Caption" value="内嵌显示区域">
<param name="Border" value="1">
<param name="Color" value="#C0C0C0">
<embed id="LODOP_EM1" TYPE="application/x-print-lodop" width=410 height=307 PLUGINSPAGE="install_lodop.exe">
</object> <br> <input type="text" id="T1" size="15"><a href="javascript:prn1_preview()">打印设计</a><br> <div id="wo" class="buledivv"> <table>
<tr><td width=400px height=100px align=center><span style="font-size:20px;">请先输入内容,不能为空!</span></td></tr>
<tr><td width=400px height=100px align=center><a href="javascript:void(0)" onclick="document.getElementById('wo').style.display='none'">
确定,关闭该提示</a></td></tr></table>
</div> <script language="javascript" type="text/javascript">
var LODOP; //声明为全局变量
function prn1_preview() {
var tex=document.getElementById('T1').value;
if(tex=="")
document.getElementById('wo').style.display='block';
else
prn2_preview();
};
function prn2_preview() {
LODOP=getLodop(document.getElementById('LODOP1'),document.getElementById('LODOP_EM1'));
LODOP.PRINT_INIT("");
LODOP.ADD_PRINT_TEXT(91,69,100,25,document.getElementById('T1').value);
LODOP.SET_SHOW_MODE("DESIGN_IN_BROWSE",1);//打印设计界面内嵌
LODOP.PRINT_DESIGN();//打印设计
};
</script>
</body>

被遮挡的原图示:

解决方法是加个空的iframe,可以让弹出层在LODOP的上层。

代码:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>WEB打印控件LODOP</title>
<script language="javascript" src="LodopFuncs.js"></script>
<style>
.buledivv{display:none;position:absolute;top:20%;left:20%;width:400px;height:200px;background-color:#7da0e1;z-index:10000;}
</style>
</head> <body>
<object id="LODOP1" classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" width=410 height=307>
<param name="Caption" value="内嵌显示区域">
<param name="Border" value="1">
<param name="Color" value="#C0C0C0">
<embed id="LODOP_EM1" TYPE="application/x-print-lodop" width=410 height=307 PLUGINSPAGE="install_lodop.exe">
</object> <br> <input type="text" id="T1" size="15"><a href="javascript:prn1_preview()">打印设计</a><br> <div id="wo" class="buledivv">
<iframe style="position:absolute;z-index:-1;width:100%;height:100%;top: 0;
left:0;scrolling:no;" frameborder="0" src="about:blank"></iframe>
<table>
<tr><td width=400px height=100px align=center><span style="font-size:20px;">请先输入内容,不能为空!</span></td></tr>
<tr><td width=400px height=100px align=center><a href="javascript:void(0)" onclick="document.getElementById('wo').style.display='none'">
确定,关闭该提示</a></td></tr></table>
</div> <script language="javascript" type="text/javascript">
var LODOP; //声明为全局变量
function prn1_preview() {
var tex=document.getElementById('T1').value;
if(tex=="")
document.getElementById('wo').style.display='block';
else
prn2_preview();
};
function prn2_preview() {
LODOP=getLodop(document.getElementById('LODOP1'),document.getElementById('LODOP_EM1'));
LODOP.PRINT_INIT("");
LODOP.ADD_PRINT_TEXT(91,69,100,25,document.getElementById('T1').value);
LODOP.SET_SHOW_MODE("DESIGN_IN_BROWSE",1);//打印设计界面内嵌
LODOP.PRINT_DESIGN();//打印设计
};
</script>
</body>

图示:由于之前的图已经有大部分代码了,这里只是加了个iframe,所以图中省去了其他部分。

LODOP内嵌挡住浏览器的div弹出层的更多相关文章

  1. div弹出层的效果带关闭按钮

    下面我做的这个是个进度条的弹出层 <style type="text/css"> #tuxiang { width: 57px; } /*div弹出框的css*/ .t ...

  2. 页面DIV弹出层 JS原生脚本

    <script type="text/javascript"> /*         * 弹出DIV层         */ function showDiv() { ...

  3. 关于div弹出层的实际应用心得

    今天本人要做一个点击弹出的功能,因为这个功能是最后做的,所以写的时候很纠结, 因为本人小菜一枚, 开始尝试用 position:relative:来做一试不行呀 ,因为用这个来做的话 会打乱原有的布局 ...

  4. 一个简单的div弹出层的小例子

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  5. 【JS新手教程】弹出两层div,及在LODOP内嵌上层

    前面的博文有个简单的弹出div层[JS新手教程]浏览器弹出div层1,有一层,不过为了提示,一般会不让用户可以点击该提示之外的地方的.如果让用户弹出层后,把其他的按钮和链接都设置不可用应该比较麻烦,如 ...

  6. DIV弹出和关闭新DIV

    代码用HTML+JS实现: 代码(用HTML+JS实现): <!doctype html> <html lang="UTF-8"> <head> ...

  7. div滚动条弹出层效果 (所需要的css文件和js文件,都已经上传到文件里面了progressbar.rar)

    <%--总的弹出层--%> <div class="tcck" id="joinclub" style="display:none& ...

  8. 使用Jq实现弹出层

    对于前端程序员来说,弹出层是经常用到的,下面我叫大家如何用实现JQuery实现弹出层的效果,代码如下: CSS:弹出层的效果 .mask { position: absolute; top: 0px; ...

  9. layui弹出层回调的使用

    <%@page language="java" contentType="text/html; charset=UTF-8"%> <%@ in ...

随机推荐

  1. 2018.10.08 NOIP模拟 栅栏(树状数组+rand)

    传送门 今天的送分题. 首先考虑每次给要围上栅栏的矩阵里的整体加上1,如果栅栏被撤销就整体减1,最后比较两个点的值是否相同来进行判断. 然而这样的效果并不理想,很容易卡掉. 进一步思考,我们第iii次 ...

  2. 2018.09.20 atcoder 1D Reversi(模拟)

    传送门 考虑每次摆石头都会消去最外层的一个连续颜色串. 所以只用统计一下有多少段颜色即可. 代码: #include<bits/stdc++.h> using namespace std; ...

  3. Linux下一个简单sniffer的实现

    Sniffer(嗅探器)是一种基于被动侦听原理的网络分析方式.将网络接口设置在监听模式,便可以将网上传输的源源不断的信息截获.对于网络监听的基本原理我们不在赘述,我们也不开启网卡的混杂模式,因为现在的 ...

  4. gj2 python中一切皆对象

    2.1 python中一切皆是对象 动态语言和静态语言的区别,Python的面向对象更彻底 同时动态语言,代码的灵活性高 没有编译(检查)的过程,错误只有在运行起来后才会发现 函数和类也是对象,属于p ...

  5. 将Excel导入DataGridView 中的"select * from [Sheet1$]"中[ ]里面表单名的动态获取

    Sheet1$是Excel默认的第一个表名,如果改动:select * from [Sheet1$]"将查询失败,因此应根据选择自动获取excel表名: OpenFileDialog ofd ...

  6. 测试mktime和localtime_r性能及优化方法

    // 测试mktime和localtime_r性能及优化方法 // // 编译方法:g++ -g -o x x.cpp或g++ -O2 -o x x.cpp,两种编译方式性能基本相同. // // 结 ...

  7. Java IO流详尽解析(转)

    流的概念和作用 学习Java IO,不得不提到的就是JavaIO流. 流是一组有顺序的,有起点和终点的字节集合,是对数据传输的总称或抽象.即数据在两设备间的传输称为流,流的本质是数据传输,根据数据传输 ...

  8. queued frame 造成图形性能卡顿

    曾经遇到过卡顿是类似的原因:当时对显卡底层知识理解不懂,看到引擎底层有一个MaxFramexxx的接口,实现是使用注册表修改显卡底层的注册信息,当时还是一个掉接口习惯的客户端码农的思维,没理解底层含义 ...

  9. 使用WebService与Oracle EBS进行集成

    http://www.cnblogs.com/isline/archive/2010/04/15/1712428.html 一.概述 OracleEBS是Oracle公司的ERP产品,这个产品非常庞大 ...

  10. matlab 生成mat文件

    生成MAT文件 假如你的矩阵A.B都已赋值,现在需要将A,B矩阵保存成mat格式文件,执行如下命令:save mydata A B 就会把A B矩阵数据保存在yourdata.dat文件中了 保存指定 ...