一、点击目标外事件

$(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. js变量及其作用域

    Javascript和Java.C这些语言不同,它是一种无类型.弱检测的语言.它对变量的定义并不需要声明变量类型,我们只要通过赋值的形式,可以将各种类型的数据赋值给同一个变量   一.js变量的类型及 ...

  2. [WebServer] Windows操作系统下 Tomcat 服务器运行 PHP 的环境配置

    前言: 由于本人在开发和学习过程中需要同时部署 JavaWeb 和 PHP 项目,于是整理了网上的一些相关资料,并结合自己的实际操作,记录于此,以供参考. 一.环境(64bit): 1.操作系统.To ...

  3. IOS开发_中遍历数组的方法及比较

    数组,做为一种常用的数据类型,频繁出现在编码中,其中肯定少不了对数组的遍历,本博文对数组遍历,进行一下自己的归纳,如果是大牛,一笑而过就好,互相学习,欢迎指正. 话不多说直接进入主题 首先创建一个数组 ...

  4. LeetCode 6 ZigZag Conversion 模拟 难度:0

    https://leetcode.com/problems/zigzag-conversion/ The string "PAYPALISHIRING" is written in ...

  5. 浅谈对ionic项目的理解

    在思考怎么将客户端app连接到服务器的时候,就在想ionic项目的本质是什么,一开始因为ionic serve这一命令,我以为它自己就是个服务器,但是后来一细想又感觉不是这样,不然客户端又该怎么和服务 ...

  6. 使用Runtime.getRuntime().exec()在java中调用python脚本

    举例有一个Python脚本叫test.py,现在想要在Java里调用这个脚本.假定这个test.py里面使用了拓展的包,使得pythoninterpreter之类内嵌的编译器无法使用,那么只能采用ja ...

  7. 开启关闭keditor 过滤

    filterMode: false, K.create('#txt_content', { uploadJson: '/js/kindeditor-4.1.10/upload_json.ashx', ...

  8. 面试复习(C++)之直接插入排序

    #include <iostream> using namespace std; void Insertsort(int *a,int len) { ;j<len;j++) { in ...

  9. Xcode开发小问题集锦

    Q:用Xcode 6 创建的工程在iOS 7的设备上运行时上下部均会出现黑色的区域且应用不能全屏运行. A:Targets -> General -> App Icons and Laun ...

  10. unity 发布web player版,网页打开报Failed to initialize player's 3D settings

    开始时我装的是unity 5.0.0b1,不知道在哪找的这个版本. web player 装的什么版本也忘了. 最后卸载了web player,重新安装web player并另外安装一个unity4. ...