手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >js操作模态窗口及父子窗口间相互传值示例
js操作模态窗口及父子窗口间相互传值示例
摘要:parent.hmtl复制代码代码如下:父窗口window.onload=function(){varbtn=document.getEle...

parent.hmtl

复制代码 代码如下:

<!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>父窗口</title>

<script type="text/javascript">

window.onload=function(){

var btn=document.getElementById("btn");

btn.onclick=function(){

var obj={

test:"张三传到子窗口",

win:window

};

var returnValue = window.showModalDialog("child.html",obj,"dialogLeft:100px;dialogTop:100px;dialogWidth:400px;dialogHeight:300px;resizable:yes");

if(returnValue != null){

document.getElementById("content").innerHTML = returnValue;

}

};

}

</script>

</head>

<body>

<div id="content"></div>

<input type="button" id="btn" value="弹出子窗口">

</body>

</html>

child.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>子窗口</title>

<script type="text/javascript">

window.onload=function(){

//获取url的传参

var args = window.dialogArguments;

var win = args.win;//父窗口对象

var content=document.getElementById("content");

content.value=args.test;

var btn=document.getElementById("btn");

btn.onclick=function(){

//模态对话框将值

window.returnValue = content.value;

window.close();

}

}

</script>

</head>

<body>

<input type="text" id="content"><input type="button" id="btn" value="传值给父窗口">

</body>

</html

【js操作模态窗口及父子窗口间相互传值示例】相关文章:

Java新手入门教程:新手必须掌握的30条Java基本概念

超酷右下浮出广告窗口代码

JavaScript窗口功能指南之在窗口中书写内容

javaScript中slice函数用法实例分析

js实现点击链接后延迟3秒再跳转的方法

JavaScript实现弹出模态窗体并接受传值的方法

JQuery插件jcarousellite的参数中文说明

浅谈angularJS 作用域

javascript字符串与数组转换汇总

解决未知尺寸的图片撑破页面的问题

精品推荐
分类导航