iframe标签里面的页面元素只读,可以通过设置一个只读的透明div进行遮罩实现。

html代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<style>
.mask
{
position: absolute;
width: 100%;
height: 100%;
z-index: 1;
filter: alpha(opacity=0);
opacity: 0;
background: #ffffff;
}
</style>
<div style="position: relative">
<div class="mask">
</div>
<iframe src="http://bbs.csdn.net" width="500px" height="300px" id="ifr"></iframe>
</div>

效果:

iframe标签里面的页面元素只读的更多相关文章

  1. iframe标签flash遮盖页面元素问题——wmode参数

    最近做项目过程中,遇到各种小问题,所以打算通过博客园来记录各问题的解决办法. 这篇的问题背景是这样子的:项目是用的AngularJS框架,在某个页面上用了wangEditor富文本编辑器插件(gith ...

  2. JQuery调用iframe父页面元素与方法

    JQuery操作iframe父页面与子页面的元素与方法 下面简单使用Jquery来操作iframe的一些记录,这个使用纯JS也可以实现. 第一.在iframe中查找父页面元素的方法: $('#id', ...

  3. iframe中操作主体页面的元素,方法

    在不使用三大框架的情况下,iframe的使用可以做到在页面中直接引入别的页面作为当前页面的一部分,但是在iframe的使用过程中存在一些相互之间的操作 例如在iframe中获取主页面的元素,使用主页面 ...

  4. iframe 调用父页面元素

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="IFrame.aspx.cs ...

  5. iframe多层嵌套时获取元素总结

    父页面获取子页面元素: 注意:onload事件 jQuery获取: $("iframe").contents().find("holder")......; ( ...

  6. 使用iframe标签结合springMvc做文件上传

    1.iframe.jsp <body> <h1>测试iframe文件上传</h1> <!-- 1.要求表单的target属性名称与iframe的name名字一 ...

  7. iframe标签在PC端的使用

    随着前端框架的崛起 各种组件化 模块化开发 然而我发现在PC端要考虑兼容 ~~~~ 自己琢磨着 在PC端怎么吧一个页面做成一个公共的部分  发现有个iframe标签可以在页面中嵌套 虽然iframe可 ...

  8. iframe高度自动随着子页面的高度变化而变化(不止要在iframe标签里加上this.height=this.contentWindow.document.body.scrollHeight)

    最近使用iframe整合页面遇到一些难题,走了很多弯路才解决,借此记录一下: 1 <!-- 页面主体内容 --> 2 <div class="iframe-wrapper& ...

  9. Selenium_webdriver获取iframe子页面元素

    有时候我们在定位一个页面元素的时候发现一直定位不了,反复检查自己写的定位器没有任何问题,代码也没有任何问题.这时你就要看一下这个页面元素是否在一个iframe中,这可能就是找不到的原因之一.如果你在一 ...

随机推荐

  1. 利用AndroidStudio开发java工程

    1.新建一个project,或者如果你已经有project的话,那就直接新建一个module.注意选择Java library,然后下一步. 2.输入module的一些信息.点击finish.(在创建 ...

  2. Django学习(4)表单,让数据库更美好

    表单,在HTML中的标签为<form></form>,在网页中主要负责数据采集功能.我们在浏览网站时,常常会碰到注册账号.账号登录等,这就是表单的典型应用. 在Django学习 ...

  3. 小白的Python之路 day3 函数式编程,高阶函数

    函数式编程介绍   函数是Python内建支持的一种封装,我们通过把大段代码拆成函数,通过一层一层的函数调用,就可以把复杂任务分解成简单的任务,这种分解可以称之为面向过程的程序设计.函数就是面向过程的 ...

  4. 【python】lambda创建匿名函数

  5. 【java】io流之字节流转为字符流:java.io.OutputStreamWriter和java.io.InputStreamReader

    package 文件操作; import java.io.File; import java.io.FileOutputStream; import java.io.IOException; impo ...

  6. iOS tableview和 Collection复用机制

    TableView的重用机制,为了做到显示和数据分离, tableView的实现并且不是为每个数据项创建一个tableCell.而是只创建屏幕可显示最大个数的cell,然后重复使用这些cell,对ce ...

  7. 502 VS 504

    本文同时发表在https://github.com/zhangyachen/zhangyachen.github.io/issues/89 首先看一下概念: 502:作为网关或者代理工作的服务器尝试执 ...

  8. SVO环境搭建

    我是装了双系统,实验OS:Ubuntu14.04 Installation: Plain CMake (No ROS) 首先,建立一个工作目录比如:workspace,然后把下面的需要的都在该目录下进 ...

  9. bzoj 4898: [Apio2017]商旅

    Description 在广阔的澳大利亚内陆地区长途跋涉后,你孤身一人带着一个背包来到了科巴.你被这个城市发达而美丽的市场所 深深吸引,决定定居于此,做一个商人.科巴有个集市,集市用从1到N的整数编号 ...

  10. 微信小程序如何开发制作

    微信小程序如何开发制作 微容SMO是一款微信小程序的免费在线制作工具,用户在微容平台上无需编辑代码,可通过拖拽式操作即可完成小程序的制作,真正意义上实现了小程序零代码免费制作! 消除技术门槛:无需代码 ...