【JS】点击目标外事件与IFRAM自适应高度
一、点击目标外事件
$(document).mouseup(function(e){
var _con = $('.dropdown-multiSelect-list'); // 设置目标区域
if(!_con.is(e.target) && _con.has(e.target).length === 0){ // Mark 1
_con.hide();// 功能代码
}
});
二、IFRAME自适应高度
兼容IE6/IE7/IE8/Firefox/Opera/Chrome/Safari
1,原生JS
<iframe src="../Index.aspx" id="iframe" frameborder="0" scrolling="no" onload="iFrameHeight();" width="100%"></iframe>
function iFrameHeight() {
var ifm = document.getElementById("iframe");
var subWeb = document.frames ? document.frames["iframe"].document : ifm.contentDocument;
if (ifm != null && subWeb != null) {
ifm.height = subWeb.body.scrollHeight;
}
}
2,JQUERY
方法一(子页面调用)
//注意:下面的代码是放在iframe引用的子页面中调用
$(window.parent.document).find("#iframe").load(function(){
var main = $(window.parent.document).find("#iframe");
var thisheight = $(document).height()+30;
main.height(thisheight);
});
方法二(父页面调用)
//注意:下面的代码是放在和iframe同一个页面调用
$("#iframe").load(function(){
var mainheight = $(this).contents().find("body").height()+30;
$(this).height(mainheight);
});
三、思考
关于自适应,业务中遇到一个问题。
在chrome中,父页面调用上述JQUERY方法二,子页面有图片的情况下,onload方法失效,而在IE下反而是正常的。
同页面的其他无图片的子页面,高度获取正常,需要思考解决。
————————————————————————————————————————————————————————————————————————————
2016/10/25更新
子页面有图片的情况下,父页面写入自适应高度失效,通过子页面控制高度可以修复。
【JS】点击目标外事件与IFRAM自适应高度的更多相关文章
- js点击空白处触发事件
我们经常会出现点击空白处关闭弹出框或触发事件 <div class="aa" style="width: 200px;height: 200px;backgroun ...
- js点击按钮触发事件的方法
<!DOCTYPE html> <html> <body> <h1>My First Web Page</h1> <input id= ...
- IOS的UIWebView中JS点击事件,需要加入cursor:pointer;属性才可以
IOS的UIWebView中JS点击事件,需要加入cursor:pointer;属性才可以. Android的WebView可以支持外链样式,js文件:IOS则需要改为内嵌样式和JS文件.
- 使用JS或jQuery模拟鼠标点击a标签事件代码
原文 使用JS或jQuery模拟鼠标点击a标签事件代码 这篇文章主要介绍了使用JS或jQuery模拟鼠标点击a标签事件代码,需要的朋友可以参考下 <a id="alink" ...
- 项目遇到的小问题(关于vue-cli中js点击事件不起作用和iconfont图片下载页面css样式乱的解答)
第一个:关于vue-cli中js点击事件不起作用 在vue的methods方法queryBtnFun()中拼接html和click操作事件的时候,发现点击事件一起未起作用: 后来发现是DOM执行顺序 ...
- JS中点击事件冒泡阻止
JS中点击事件冒泡阻止 解析: 一个div层'out',内含有一个div层'in'.如下: 两个层都绑定了点击事件,但是点击in层的时候,点击事件会出现冒泡现象,同时也会触发out层的点击事件. 但是 ...
- vue实现点击目标元素外页面的其他地方隐藏弹窗。
方法: 步骤1:给页面最外出的元素div加点击事件:@click=“popShow = false”. 步骤2:给点击目标元素加点击事件:@click=“popShow = true”. 备注:pop ...
- contains 之 点击元素外位置隐藏元素
contains 之 点击元素外位置隐藏元素 api: contains 检测一个元素包含在另一个元素之内 详解:http://www.runoob.com/jquery/misc-contai ...
- Ext JS学习第十六天 事件机制event(一) DotNet进阶系列(持续更新) 第一节:.Net版基于WebSocket的聊天室样例 第十五节:深入理解async和await的作用及各种适用场景和用法 第十五节:深入理解async和await的作用及各种适用场景和用法 前端自动化准备和详细配置(NVM、NPM/CNPM、NodeJs、NRM、WebPack、Gulp/Grunt、G
code&monkey Ext JS学习第十六天 事件机制event(一) 此文用来记录学习笔记: 休息了好几天,从今天开始继续保持更新,鞭策自己学习 今天我们来说一说什么是事件,对于事件 ...
随机推荐
- php生成图片缩略图,支持png透明
注:此功能依赖GD2图形库 PHP生成缩略图类 <?php /* * desc: Resize Image(png, jpg, gif) * author: 十年后的卢哥哥(http://w ...
- [WebServer] Windows操作系统下 Tomcat 服务器运行 PHP 的环境配置
前言: 由于本人在开发和学习过程中需要同时部署 JavaWeb 和 PHP 项目,于是整理了网上的一些相关资料,并结合自己的实际操作,记录于此,以供参考. 一.环境(64bit): 1.操作系统.To ...
- SqlServer索引使用及维护
在应用系统中,尤其在联机事物处理系统中,对数据查询及处理速度已成为衡量应用系统的标准. 而采用索引来加快数据处理速度也成为广大数据库用户所接受的优化方法. 在良好的数据库设计基础上,能够有效地索引是S ...
- LeetCode 5 Longest Palindromic Substring manacher算法,最长回文子序列,string.substr(start,len) 难度:2
https://leetcode.com/problems/longest-palindromic-substring/ manacher算法相关:http://blog.csdn.net/ywhor ...
- 用Runtime.getRuntime().exec()需要注意的地方
有时候我们可能需要调用系统外部的某个程序,此时就可以用Runtime.getRuntime().exec()来调用,他会生成一个新的进程去运行调用的程序. 此方法返回一个java.lang.Proce ...
- AngularJS - Passing data between pages
You need to create a service to be able to share data between controllers. app.factory('myService', ...
- DotSpatial 创建面状要素——含空洞
private void toolStripButton23_Click(object sender, EventArgs e) { //选择图层 FeatureSet fs = null; fs = ...
- 利用netperf、iperf、mtr测试网络
1.netperf安装和使用 netperf安装 # tar -xzvf netperf-.tar.gz # cd netperf- # ./configure # make # make insta ...
- B2C电子商务基础系统架构解析(转载)
系统的开发与演化,前台严格follow消费者的购买流程,后台则盯牢订单流转,牢牢抓住这两条主线,才能高屋建瓴的看清B2C的逻辑链和数据流,更深刻的规划功能模块,从而更有效支撑实际业务的流转. 前台 前 ...
- Linq 备忘录
public class CTest { public int i { get; set; } public string j { get; set; } } 一.Range var items=En ...