js操作iframe父子窗体示例_javascript技巧

父窗体获取iframe

window.iframeId

iframe获取父窗口

window.parent

parent.html

复制代码 代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function btnFn(){
window.subWin.test();
}
function get(name){
return document.getElementById(name);
}
</script>
</head>
<body>
<input id="name" type="text" value="222">
<input type="button" id="btn" value="点击" onclick="btnFn();"><br/>
<br/><br/>
<iframe src="sub.html" id="subWin"
name="subWin" width="100%" marginwidth="0" height="100%"
marginheight="0" scrolling="Yes" frameborder="0" valign="middle"
resize="no" style="display: block;border:3px solid red;"></iframe>

</body>
</html>

sub.html

复制代码 代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" >
function test(){
alert(window.parent.get("name").value);//结果:222
}

</script>
</head>
<body>
我是窗体的内容
</body>
</html>

时间: 2024-09-20 05:36:06

js操作iframe父子窗体示例_javascript技巧的相关文章

JS调用打印机功能简单示例_javascript技巧

本文实例讲述了JS调用打印机功能的方法.分享给大家供大家参考,具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head&g

js操作数组函数实例小结_javascript技巧

本文实例讲述了js操作数组函数.分享给大家供大家参考,具体如下: 1.删除数组中指定的元素 /** * 参考实例 foreach = function (obj, insp){ if(obj== null && obj.constructor != Array){ return []; } //obj是要处理的数组,obj==null 表示对象尚未存在:obj.constructor != Array 表示对象obj的属性的构造函数不是数组: //constructor属性始终指向创建当前

js操作checkbox遇到的问题解决_javascript技巧

遇到操作checkbox的问题全选 复制代码 代码如下: $("input[type='checkbox']").each(function(){    this.checked=true    }) 反选$("input[type='checkbox']").each(function(){if(this.checked){    this.checked=false    }    else{        this.checked=true        }

JS操作JSON要领详细总结_javascript技巧

JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式.同时,JSON是 JavaScript 原生格式,这意味着在 JavaScript 中处理 JSON数据不须要任何特殊的 API 或工具包. 本文主要是对JS操作JSON的要领做下总结. 在JSON中,有两种结构:对象和数组. 1. 一个对象以"{"(左括号)开始,"}"(右括号)结束.每个"名称"后跟

JS操作数据库的实例代码_javascript技巧

一.创建SQL Server数据库建库:test建表: 复制代码 代码如下: /* Navicat MySQL Data Transfer Source Server         : localhost Source Server Version : 50520 Source Host           : localhost:3306 Source Database       : mo Target Server Type    : MYSQL Target Server Versio

js操作二级联动实现代码_javascript技巧

表结构 二级或多级联动主要是以数据库中具有父编号的表为基础,这个也不例外 id,parent_id,name 三列. 采用js操作 先说下数据在js中的存储方式. 主要用二维数组来存储数据.结构如下: a[父编号]=[[子编号1,子名称1],[子编号2,子名称2],[子编号3,子名称3],--]; 首先用父编号获取所有的子数据,在把子数据的编号及名称绑定在dropdown中 第一步 二级联动数据(后面说这些数据怎么得到) 复制代码 代码如下: var cities=new Array(); ci

JS操作HTML自定义属性的方法_javascript技巧

本文实例讲述了JS操作HTML自定义属性的方法.分享给大家供大家参考.具体如下: HTML代码如下(其中的displayName为自定义属性): 复制代码 代码如下: <input type="text" id="txtBox" displayName="123456" /> 获取自定义属性值: 复制代码 代码如下: document.getElementById("txtBox").getAttribute(&q

js表单登陆验证示例_javascript技巧

本文实例讲述了js表单登陆验证的方法.分享给大家供大家参考,具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head>

JS自定义混合Mixin函数示例_javascript技巧

本文实例讲述了JS自定义混合Mixin函数.分享给大家供大家参考,具体如下: <script type="text/javascript"> /* 增加函数 */ function augment(receivingClass, givingClass) { for(methodName in givingClass.prototype) { if(!receivingClass.prototype[methodName]) { receivingClass.prototy