一、点击目标外事件

$(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自适应高度的更多相关文章

  1. js点击空白处触发事件

    我们经常会出现点击空白处关闭弹出框或触发事件 <div class="aa" style="width: 200px;height: 200px;backgroun ...

  2. js点击按钮触发事件的方法

    <!DOCTYPE html> <html> <body> <h1>My First Web Page</h1> <input id= ...

  3. IOS的UIWebView中JS点击事件,需要加入cursor:pointer;属性才可以

    IOS的UIWebView中JS点击事件,需要加入cursor:pointer;属性才可以. Android的WebView可以支持外链样式,js文件:IOS则需要改为内嵌样式和JS文件.

  4. 使用JS或jQuery模拟鼠标点击a标签事件代码

    原文 使用JS或jQuery模拟鼠标点击a标签事件代码 这篇文章主要介绍了使用JS或jQuery模拟鼠标点击a标签事件代码,需要的朋友可以参考下 <a id="alink" ...

  5. 项目遇到的小问题(关于vue-cli中js点击事件不起作用和iconfont图片下载页面css样式乱的解答)

     第一个:关于vue-cli中js点击事件不起作用 在vue的methods方法queryBtnFun()中拼接html和click操作事件的时候,发现点击事件一起未起作用: 后来发现是DOM执行顺序 ...

  6. JS中点击事件冒泡阻止

    JS中点击事件冒泡阻止 解析: 一个div层'out',内含有一个div层'in'.如下: 两个层都绑定了点击事件,但是点击in层的时候,点击事件会出现冒泡现象,同时也会触发out层的点击事件. 但是 ...

  7. vue实现点击目标元素外页面的其他地方隐藏弹窗。

    方法: 步骤1:给页面最外出的元素div加点击事件:@click=“popShow = false”. 步骤2:给点击目标元素加点击事件:@click=“popShow = true”. 备注:pop ...

  8. contains 之 点击元素外位置隐藏元素

    contains 之 点击元素外位置隐藏元素 api: contains   检测一个元素包含在另一个元素之内  详解:http://www.runoob.com/jquery/misc-contai ...

  9. Ext JS学习第十六天 事件机制event(一) DotNet进阶系列(持续更新) 第一节:.Net版基于WebSocket的聊天室样例 第十五节:深入理解async和await的作用及各种适用场景和用法 第十五节:深入理解async和await的作用及各种适用场景和用法 前端自动化准备和详细配置(NVM、NPM/CNPM、NodeJs、NRM、WebPack、Gulp/Grunt、G

    code&monkey   Ext JS学习第十六天 事件机制event(一) 此文用来记录学习笔记: 休息了好几天,从今天开始继续保持更新,鞭策自己学习 今天我们来说一说什么是事件,对于事件 ...

随机推荐

  1. 安装AutoCAD2006时,提示已终止安装

    .NET Framework Runtime 1.1 版本比你机子里面的版本低,直接跳过这个安装就可以了.直接运行acad.msi,直接安装.

  2. android开发 兵器

    spring for android andriod anotatons 按android原生的方式写代码,会导致冗余,代码丑陋,开发效率低下. 最近对项目代码进行一些梳理和改进.

  3. sql 多行转换为一行

    select 字段1, [val]=( select 字段2 +',' from 表名 as b where b.字段1 = a.字段1  for xml path('')) from 表名 as a ...

  4. [css3]跑马灯

    <div class="marquee"> <div> <p>纯CSS3生成的走马灯效果</p> <p>纯CSS3生成的 ...

  5. RSA大会播报 – 2014最佳安全博客提名(国外篇)

    最佳企业安全博客提名:     Juniper(网络厂商,不用多介绍):http://forums.juniper.net/t5/Security-Mobility-Now/bg-p/networki ...

  6. 极光推送Jpush(v3)服务端PHP版本集成(V3版本只调用推送API)

    因为版本升级,极光推送的API也有了V3,功能也更丰富了,但是对于我们有的用户来说,我们还是只需要调用推送的API就够了. 下载了一份PHP服务端的SDK(下载地址:http://docs.jpush ...

  7. C++ 之引用

    int argc ,char * argv[] - argument count & argument vector argc - 命令行参数个数,argv[]依次指向每一个命令行参数,其中a ...

  8. 《Pro Express.js》学习笔记——Express框架常用设置项

    Express 设置 系统设置 1.       无须再定义,大部分有默认值,可不设置 2.       常用设置 env view cache view engine views trust pro ...

  9. 基于Flask的Web应用部署到SAE上遇到的问题

    我的应用底层数据库用的是MySQL,利用Flask-SQLALchemy实现接口操作.我遇到的问题是: 在我把代码部署到SAE上后,当数据向数据库insert的时候总是出现“2006,MySQL ha ...

  10. 关于ZendFramework环境的配置

    在运用PHP进行网站建设的时候,使用框架能够很好的提高编程效率,PHP语言的框架很多,现在普遍使用的是由Zend公司开发的ZendFramework框架,本篇文章是关于ZendFramework的运行 ...