好像在不同的浏览器都有这个现象,用javascript弹出一个iframe的窗口,第一次input的焦点是正常的, 然后弹出第二次的时候,选择,按钮都可以获取到,但是input无法获得焦点,而且页面不报任何错误。

以下是摘抄的原因以及解决方法:

问题已解决,不过还是把解决方法说一下,遇到类似bug的可以参考一下

先说一下我弹出层的实现方法,具体代码不贴了,只是说一下流程:

showLogin函数是创建弹出层函数,在该函数里创建一个父div,一个iframe页面(弹出窗体);
closeIframediv是关闭弹出层;

关于弹出层关闭,一般有两种方式:一是利用div隐藏或显示来控制弹出层的显示与隐藏;二是利用DOM直接移除弹出层。

我采用的是第二种,网上资料说:

“ IE 下在移除父层的 DIV 的时候,也就是 IFrame 外层的 DIV 的时候,IE 并没有将内部的 IFrame 从 DOM 中移除,而下次触发函数创建此 IFrame 的时候,使会产生 DOM 冲突,所以解决方法就是在移除父层的 DIV 的时候,先将内部的 IFrame 也移除”

根据上面说法,我在点击“关闭”按钮时执行下面代码:

  1. document.body.removeChild(document.getElementById("iframeBox"));//移除iframe
  2. document.body.removeChild(document.getElementById(“divId”));//移除iframe父div

但是还是没解决上面的bug,其实我理解的是当移除某个元素时,出现上面bug是因为该元素并没有从内存中移除,后来发现一个CollectGarbage()函数,该函数是强制回收内存。在移除相应元素后执行该方法,强制回收内存;但是这个函数只是在IE下面才能识别的,所以要判断浏览器是否是ie才可以。这样可以解决问题。

其实有个更简单的方法,在销毁iframe之后或创建iframe后,设置一个input焦点,这样就不用判断浏览器了,直接在iframe里添加一句:

  1. document.getElementById("username").focus();

遇到这个问题,使用了@张洪保的方法,但是不知道是不是环境不同(我是win8,ie10),上网也找了很多资料,都没能解决;不过注意到一点,就是实际上是焦点失去了,如何把焦点找回来。根据这个出发点,就用一个奇葩方法解决了,加了个input控件,跟iframe同一父div下,然后iframe加载后把焦点放到这个控件上,这样问题就解决的,只要把这个input位置放到看不到的地方就ok了,希望遇到这个问题的人会有所帮助

iframe弹出窗体丢失焦点的问题的更多相关文章

  1. Easyui弹出窗体在iframe的父级页面显示

    今天做EasyUI学习的预到了一个这样的问题:通过iframe加载的一个页面在调用$.messager.alert();这个方法后只能在iframe中显示alert效果而不是在全局的页面上显示这并不我 ...

  2. 转(C# 类似右键菜单弹出窗体)

    文章来自 https://www.cnblogs.com/ahdung/p/FloatLayerBase.html 每天进步一点点 新建类  FloatLayerBase 继承Form, 自己有点小改 ...

  3. PopupWindow 从底部弹出窗体

    第一步  : 初始化PopupWindow private void initPop() { if (view == null) { // 照片 view = View.inflate(Registe ...

  4. fancybox关闭弹出窗体parent.$.fancybox.close();

    fancybox弹出窗体右上角会自带一个关闭窗体,而且点击遮罩层也会关闭fancybox 有时我们不须要这样进行关闭,隐藏关闭窗体,而且遮罩层不可点击 在弹出窗体页面加一链接进行关闭使用parent. ...

  5. MVVM模式下弹出窗体

    原地址:http://www.cnblogs.com/yk250/p/5773425.html 在mvvm模式下弹出窗体,有使用接口模式传入参数new一个对象的,还有的是继承于一个window,然后在 ...

  6. CSS3/jQuery自己定义弹出窗体

    简单演示一下,精简了演示效果和css样式文件,更利于在项目中的实际应用 引入style.css   index.js <!DOCTYPE HTML PUBLIC "-//W3C//DT ...

  7. gridView AspNetPager 翻页时 弹出窗体关闭报错

    gridView AspNetPager 翻页后,你右击刷新或F5会发现弹出一个刷新页面. 这是因为默认翻页都是用dopostback方式回发的.因为这时的页面已经不是原来的页面.所以会弹出提示. 这 ...

  8. Ext入门学习系列(二)弹出窗体

    第二章 弹出窗体 上节学习了Ext的环境搭建和最基本的一个操作——弹出对话框,作为一个引子,本节讲述如何弹出一个新窗体,从实例讲解Ext的基本运行原理. 一.Ext的窗体长什么样? 先来看看几个效果, ...

  9. C#利用API制作类似QQ一样的右下角弹出窗体

    C#利用API制作类似QQ一样的右下角弹出窗体 (2009-03-21 15:02:49) 转载▼ 标签: 杂谈 分类: .NET using System;using System.Collecti ...

随机推荐

  1. PyCharm社区版+Django搭建web开发环境

    PyCharm开源社区版不像商业版那样可以直接通过Django来创建项目,必须通过以下几个步骤进行: 1. 创建项目:在cmd命令行下输入:django-admin startproject Demo ...

  2. 关于框架搭建-web

    最近一直在学习前端相关的东西,在学了一堆基础可以以及动手在某个前端框架上写了一些东西之后,我想尝试着开始自己搭建一个框架.不知道时间需要多久,但会持续更新.小菜鸟的成长记录. ------------ ...

  3. Linux系统自带服务罗列

    /ect/services 文件列出了系统详细的服务 红色字体为常用服务 acpid ACPI(全称 Advanced Configuration and Power Interface)服务是电源管 ...

  4. nyoj 310二分+dinic

    #include<stdio.h> #include<queue> #include<string.h> using namespace std; #define ...

  5. DOM对象属性(property)与HTML标签特性(attribute)

    HTML中property与attribute是极易混淆的两个概念.大多数时候这两个单词都翻译为"属性",为了区分二者,一般将property翻译为"属性",a ...

  6. kendo grid create

    这种自定义的create中的函数,这个data的行为是在发送到后端之前执行的 //{ // url: "/admgr/AdUserAuthorityAdd", // dataTyp ...

  7. [bzoj3524/2223][Poi2014]Couriers_主席树

    Couriers bzoj-3524 Poi-2014 题目大意:给定n个数的序列,询问区间内是否存在一个在区间内至少出现了(区间长度>>1)次的数.如果有,输出该数,反之输出0. 注释: ...

  8. DataSource是一个java ee的标准接口和servlet一样,用于数据库连接池上

    1.DataSource是一个java ee的标准接口和servlet一样,用于数据库连接池上,需要第三方来具体实现. 2.DataSource是一个java ee的标准接口和servlet一样,用于 ...

  9. 使用markdown和gitblog搭建自己的博客

    GitBlog官网 GitBlog文档 Gitblog官方QQ群:84692078 GitBlog是一个简单易用的Markdown博客系统.它不须要数据库,没有管理后台功能,更新博客仅仅须要加入你写好 ...

  10. 向Java枚举类型中加入新方法

    除了不能继承enum之外,可将其看做一个常规类.甚至能够有main方法. 注意:必须先定义enum实例.实例的最后有一个分号. 以下是一个样例:返回对实例自身的描写叙述,而非默认的toString返回 ...