警惕多iframe下的同名id引起的诡异问题
遇到个诡异bug,虽然bug中套bug,忽略次要bug,其中最诡异最典型的现象是多行window.top.$("#id")取值操作,其中有一行却取不到值.这个着实让我费解.因为用到了top,我开始以为是z-index引起的层级问题.因为我在页面中alert一下要取的元素,页面功能就看起来正常了.只不过期间多了一个弹出框.正常后怎么都是正常的,除非重新开启浏览器会再次故障.
当然这期间查找过取不到值的id,确实是存在的.再看一下整个页面的布局,多个iframe,每个iframe最终会引入一个jsp页面.所以整体布局非常复杂,着实让人头大,无奈只好回退到20个版本之前,一个一个版本试验,查找故障边界版本..
在挣扎了10几个版本后终于确定到故障发生的版本,我个人认为这个应该是主页面的布局被损坏了,所以查看一下故障版本对主页面的更改,在引入的js文件中查到一个让我崩溃的结果.这个故障版本中居然通过jquery在主页面中生成了一个元素,但是这个元素的id和页面中的某个iframe将要引入的子jsp文件中的一个元素id是相同的,也就是说,这个页面中有2个id相同的元素,一个在主页面中,一个在引入的子jsp页面中,结果导致引入的jsp文件中相关方法全都异常失效,而且失效的表现还很诡异..
这让我长了一个教训啊,因为是多个iframe,所以在确认页面中是否存在要取值的id元素时,也仅仅是确认了子jsp页面中是否存在,完全没想到id同名会造成这么诡异的问题.
所以要是引入多个jsp页面出现故障,不妨排查一下所有子jsp页面中的id是否和主页面中的元素id有重名的.
警惕多iframe下的同名id引起的诡异问题的更多相关文章
- iframe下元素定位
1.iframe基础知识: <frameset>生成的框架结构是依赖上级空间尺寸的,它的宽度或者高度必须有一个和上级框架相同.而<iframe>浮动框架可以完全由指定宽度和高度 ...
- [HTML]HTML框架IFrame下利用JS在主页面和子页面间传值
今天写的程序涉及到JS框架传值的问题,这些是我找到的一些资料 下面主页面和子页面互相传值的DEMO 如果仅仅需要子页面触发主页面的函数 仅需 [ parent.window.你的函数 ] 就可以了 D ...
- 认真研究下HTML之id、name、form、submit
#起因 同事希望在提交之后关闭父窗口,但是,始终没有提交请求发出.他的代码大概如下: // <form id='f' action=... // <button onclick='fun( ...
- Shell 实现找出两个目录下的同名文件方法
# 首先我们来创建一些 2 个目录,里面的目录结构及相关文件如下所示: # 从上面的测试目录可以看到, lol.txt lol2.txt 两个文件是两个目录下的同名文件 # 有实际例子,思路就容易出来 ...
- struts2拦截器实现session超时返回登录页面(iframe下跳转到其父页面)
需求:session超时时,返回登录页面,由于页面嵌套在iframe下,因此要跳转到登录页面的父页面,但是首页,登录页面等不需要进行跳转 实现: java文件:SessionIterceptor.ja ...
- Python复制指定目录的各个子目录下的同名文件到指定文件夹并重命名
Python复制指定目录的各个子目录下的同名文件到指定文件夹并重命名 #编码类型 #-*- coding: UTF-8 -*- #导入包 import os import shutil srcpath ...
- 页面间(窗口间)的取值赋值及获取iframe下的window对象
①同一个窗口中,获取某个iframe的信息 <body> <iframe id="PAID" name="PA" src="Item ...
- 在iframe下的页面锚点失效问题,用jquery进行修复
应用场景是:iframe页面没有滚动条,在父窗体中出现滚动条,锚点标记就会失效,因为,锚点是根据当前窗口滚动条滚动窗口的,成为子窗体后没有了滚动条,自然不会滚动. 解决办法是:用js判断页面是否被嵌套 ...
- 如果layer层在iframe下不居中滚动
需要在layer前面加上parent.layer. 2.运用layer层的步骤: 1.引入1.8版本以上的jquery文件 <script type="text/javascript& ...
随机推荐
- windows 端口 任务
- 【初探Underscore】再说模版引擎
前言 Underscore 是一个JavaScript实用库,提供了类似Prototype.js (或 Ruby)的一些功能,但是没有扩展任何JavaScript内置对象. 它弥补了部分jQuery没 ...
- [deviceone开发]-do_Viewshower的动画效果示例
一.简介 do_Viewshower组件也支持View之间的过场动画,支持大概12种,这个示例随机的切换12种动画中的一种,而且每次切换的动画时间不一样.直观的展示12种动画的效果.适合初学者. 二. ...
- Sharepoint学习笔记—习题系列--70-576习题解析 -(Q59-Q62)
Question 59You are designing a collection of Web Parts that will be packaged into a SharePoint 2010 ...
- 操作系统开发系列—13.i.进程调度 ●
上面的三个进程都是延迟相同的时间,让我们修改一下,尝试让它们延迟不同的时间. void TestA() { int i = 0; while (1) { disp_str("A." ...
- iOS开发之多线程技术
本篇争取一篇讲清讲透,依然将通过四大方面清晰的对iOS开发中多线程的用法进行详尽的讲解: 一.什么是多线程 1)多线程执行原理 2)线程与进程 3)多线程的优缺点 二.我们为什么要用多线程编程技术 三 ...
- android 数据存储Ⅱ
本章继续讲解在Android开发中,数据的存储与管理.涉及知识点:SQLite,SwipeRefreshLayout控件刷新. 1.功能需求 练习使用SQLite 做一个登录界面,数据库字段包含用户名 ...
- iOS中数据传值的几种方式
值传递:基本数据类型的变量之间的数据传递 //值传递不会改变变量的值 void func(int a) { a = ; } int main(int argc, const char * argv[] ...
- GY编辑平台产品总结
产品亮点一.实时直播流的关键帧识别并展示选择频道的实时流并播放后,会在窗口中自动展示关键帧图片:配对选择关键帧的截图即确定了素材的入点,出点:编辑平台图如下所示:二.广告自动识别与监测方案1. 制作样 ...
- 使用JUnit4测试Spring
测试DAO import static org.junit.Assert.*; import org.junit.Before; import org.junit.Ignore; import org ...