多个iframe中根据src获取特定iframe并执行操作

前言:在项目中做一个批量编辑工单时需要在一大堆的iframe中的某一个iframe里边再用模态框的形式显示编辑区域,然后再在模态框里边加入iframe实现批量编辑的页面,最后在提交后无法实现跳转,就是当前模态框无法关闭,想到模态框的关闭是通过modal:hide关闭,就想在后端输出js代码直接通过click事件来关闭模态框


具体问题:

  • 在多个iframe中找到当前的iframe
  • 找到当前iframe之后操作iframe中的模态框关闭按钮,增加click事件

解决办法:

  • 通过iframe的src属性寻找iframe
  • 通过$("#frame_1").contents().find("#test"); 来找到iframe下页面中的模态框关闭按钮

通过iframe的src属性寻找iframe:

//js前端获取
var ucrIframe = window.top.$("iframe[src='/osp2016/agent/tickets.php']");

获取iframe页面中的元素并添加事件:

var ucrIframe = window.top.$("iframe[src='/osp2016/agent/tickets.php']");
//获取iframe元素 **.contents().find()
eg : curIframe.contents().find("#closeModal").click();

多个iframe中根据src获取特定iframe并执行操作的更多相关文章

  1. js获取iframe中的元素以及在iframe中获取父级的元素(包括iframe中不存在name和id的情况)

      第一种情况:iframe中不存在name和id的方法:(通过contentWindow获取) var iframe = document.getElementsByTagName('iframe' ...

  2. jsp页面中某个src,如某个iframe的src,应该填写什么?可以是html、jsp、servlet、action吗?是如何加载的?

    jsp页面中某个src,如某个iframe的src,应该填写什么?可以是html.jsp.servlet.action吗?是如何加载的? 如有个test工程,其某个jsp中有个iframe,代码如下: ...

  3. 关于如何获取iframe中的元素

    今天研究了一下iframe中元素的获取,发现有些地方还是有点坑的. 首先:如果使用纯前端手段,是没有办法获取非同源的iframe中的元素的,后面会提到后端手段 一.同源环境 1.首先在父页面获取ifr ...

  4. 获取父窗口元素或者获取iframe中的元素(相同域名下)

    jquery方法 在父窗口中获取iframe中的元素 //方法1 $("#iframe的ID").contents().find("iframe中的元素"); ...

  5. 同一页面的两个Iframe,其中一个iframe获取另一个iframe内的iframe中的元素值

    公共父页面(主页面): <%@ page language="java" import="java.util.*" pageEncoding=" ...

  6. Jquery取得iframe中元素的几种方法

    [jquery]获取iframe中的body元素: $("iframe").contents().find("body").html(); [使用jquery操 ...

  7. 解析Jquery取得iframe中元素的几种方法

    iframe在复合文档中经常用到,利用jquery操作iframe可以大幅提高效率,这里收集一些基本操作,需要的朋友可以参考下   DOM方法:父窗口操作IFRAME:window.frames[&q ...

  8. 从后台读取项目文件在前端iframe中展示

    项目中有个需求是: 对于外部提供的前端项目,包含css.js.html.图片等的项目,将这个项目存进数据库,然后iframe中展示html,然后html中引用的js.css等文件 也能从数据库中读取并 ...

  9. 【HTML】Iframe中的onload事件

    当iframe.src重新指定一个url时会重新执行iframe的onload事件 <iframe id="indexFrame" name="index" ...

随机推荐

  1. vue中使用refs定位dom出现undefined?

    之前在公司做项目,一直感觉用ref来定位dom节点挺方便的.但是期间遇到了一个问题,就是在mounted(){}钩子里面使用this.$refs.xxx,打印出来的却是undefined? 于是我就对 ...

  2. go基础系列:简介

    1.Go简介 Go语言是编译型.静态类型的类C的语言,并带有GC(垃圾收集器,garbage collection).这意味着什么? 另外,Go是一种非常严格的语言,它几乎总是要求我们"以标 ...

  3. QT 应用程序测试

    添加环境 export QTEDIR='/Qt5' export QTINC='/Qt5/include/' export QTLIB='/Qt5/lib' export QT_QPA_FB_TSLI ...

  4. IE的浏览器模式、文本模式

    最近在部署网页的时候,发现IE下的布局完成混乱. 在改变IE的文本模式后,显示就正常了. IE的浏览器模式,用于切换IE针对该网页的默认文本模式.对不同版本浏览器的条件注释解析.决定请求头里userA ...

  5. 【转】AJAX中JSON数据的返回处理问题

    AJAX处理复杂数据时,便会使用JSON格式.常用在对数据库的数据查询上.在数据库查询到数据后,便可在处理页面直接将数据转为JSON格式,然后返回. 本篇主要讨论:jQuery中,JSON数据在AJA ...

  6. python基础学习(七)列表

    列表的定义 List(列表) 是 Python 中使用 最频繁 的数据类型,在其他语言中通常叫做 数组(例如java.c) 专门用于存储 一串 信息 列表用 [] 定义,数据 之间使用 , 分隔 列表 ...

  7. idea护眼色设置

    idea右侧编辑区设置护眼色

  8. angularJs学习笔记-入门

    1.angularJs简介 angularJs是一个MV*的javascript框架(Model-View-Whatever,不管是MVVM还是MVC,统归MDV(model drive view)) ...

  9. vue从入门到进阶:渲染函数 & JSX(八)

    Vue 推荐在绝大多数情况下使用 template 来创建你的 HTML.然而在一些场景中,你真的需要 JavaScript 的完全编程的能力,这就是 render 函数,它比 template 更接 ...

  10. HTML笔记(适合新手入门)

    HTML Web 标准构成 Web标准不是某一个标准,而是由W3C和其他标准化组织制定的一系列标准的集合. 主要包括结构(Structure).表现(Presentation)和行为(Behavior ...