利用JQuery操作iframe父页面/子页面元素和方法汇总

createh55个月前 (02-01)技术教程46

前言

iframe在复合文档中经常用到,利用jquery操作iframe可以大幅提高效率,本文主要给大家分享了关于简单使用JQUERY来操作IFRAME的一些记录,这个使用纯JS也可以实现。下面话不多说了,来一起看看详细的介绍吧。

第一、在iframe中查找父页面元素的方法:

$('#id', window.parent.document)

第二、在父页面中获取iframe中的元素方法:

$(this).contents().find("#id")

第三、在iframe中调用父页面中定义的方法和变量:

parent.method parent.value

JQUERY、JS调用IFRAME父窗口与子窗口元素的方法

1.jquery 在iframe子页面获取父页面元素代码如下:

$("#id", parent.document)

2. jquery在父页面 获取iframe子页面的元素 代码如下:

$("#id",document.frames('iframename').document)

3.js 在iframe子页面获取父页面元素代码如下:

window.parent.document.getElementByIdx_x("id");

4.js 在父页面获取iframe子页面元素代码如下:

window.frames["iframe_ID"].document.getElementByIdx_x("id");

5.子类iframe内调用父类函数:

window.parent.func();

jquery_iframe父子级页面事件使用

1、index.html

    //这里的属性只是为了全屏下边无间隙
  index.html
        //这里的样式的为了跳转之后移动端input输入完成之后下边无间隙


2、main.html


    main.html


  

相关文章

JAVA教程全集-电子版(中)(java教程电子书下载)

第4章 面向对象的程序设计基础如前所述,Java语言是一种纯面向对象的编程语言,面向对象的程序设计是以类为基础的。从本章开始,我们将从类入手,详细介绍面向对象程序设计的基本思想和方法。本章将简要介绍面...

产品设计阶段:To B软件产品设计流程总结

到了产品设计阶段,大部分产品经理(尤其是技术转型的产品经理)终于可以大大的喘一口气了,这个阶段的工作应该是产品人最最熟悉的环节了。网上关于产品设计(我总觉得这个叫需求分析)的方法论还真是多的很,场景分...

Java|剖析类内的五类成员:属性、方法、构造器、代码块、内部类

Java的哲学是一切皆类,全部代码都写在类内。Java是纯面向对象的编程语言,类是其基石。Java类有五类成员:class Person{ // ① 属性,或成员变量 String n...

php中接口、抽象类以及接口和抽象类区别详解

在php中接口抽象类、Final、Static几个我们用到的相当的简单特别是大型网站架构时都会有用到了,今天我们来看一篇关于php中抽象类、Final、Static的例子。1. 接口(1)对接口的使用...

干货总结:我对B端系统配置功能设计的思考

导读:在大型B端产品中,不可避免的出现各种配置,配置如同一个个控制阀,决定着业务的走向,并实现saas产品的千人千面,以满足不同客户的诉求,适应不同行业的业务场景。但在随着产品的发展,配置项也越来越多...

推荐策略产品经理必知必会③:粗排、精排、重排模型

前两篇文章,我们分享了数据处理和数据召回的策略。数据召回后的下一个环节就是粗排,分为基于规则、基于模型两种。这篇文章,我们来详细说明一下。一、粗排策略召回的下一个环节就是粗排。粗排主要包括两类:基于规...