 
<!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" style="margin:50px;width:100px;height:150px;border:5px solid #0000ff;"></div> 
<input type="button" id="btn" value="彈出子窗口"> 
</body> 
</html> 

child.html

復(fù)制代碼代碼如下:

 
<!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(){ 
//模態(tài)對話框?qū)⒅?
window.returnValue = content.value; 
window.close(); 
} 
} 
</script> 
</head> 
<body> 
<input type="text" id="content"><input type="button" id="btn" value="傳值給父窗口"> 
</body> 
</html 

您可能感興趣的文章:

相關(guān)文章

JavaScript實(shí)現(xiàn)反轉(zhuǎn)字符串的方法詳解
這篇文章主要介紹了JavaScript實(shí)現(xiàn)反轉(zhuǎn)字符串的方法,結(jié)合實(shí)例形式分析了字符串反轉(zhuǎn)操作,并詳細(xì)講述了相關(guān)函數(shù)的功能與使用注意事項(xiàng),需要的朋友可以參考下
2017-04-04
js彈窗返回值詳解(window.open方式)
本篇文章主要介紹了js彈窗返回值(window.open方式)。需要的朋友可以過來參考下，希望對大家有所幫助
2014-01-01
js圖片跟隨鼠標(biāo)移動代碼
大家瀏覽網(wǎng)頁的時(shí)候，見到過圖片跟隨鼠標(biāo)移動的js特效，效果非常好，是怎么實(shí)現(xiàn)的呢，實(shí)現(xiàn)這個(gè)功能很簡單，感興趣的朋友一起看看吧
2015-11-11
js制作簡單的音樂播放器的示例代碼
本篇文章主要介紹了js制作簡單的音樂播放器的示例代碼，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-08-08
詳解Webpack實(shí)戰(zhàn)之構(gòu)建 Electron 應(yīng)用
本篇文章主要介紹了Webpack實(shí)戰(zhàn)之構(gòu)建 Electron 應(yīng)用，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-12-12
前端JavaScript實(shí)現(xiàn)大數(shù)據(jù)前后模糊搜索的方法詳解
這篇文章主要為大家詳細(xì)介紹了前端JavaScript實(shí)現(xiàn)大數(shù)據(jù)前后模糊搜索的四個(gè)常見方法,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以了解下
2023-12-12
純js實(shí)現(xiàn)頁面返回頂部的動畫(超簡單)
下面小編就為大家?guī)硪黄僯s實(shí)現(xiàn)頁面返回頂部的動畫(超簡單)。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-08-08
分享XmlHttpRequest調(diào)用Webservice的一點(diǎn)心得
因?yàn)轫?xiàng)目需要，以后前端、手機(jī)客戶端調(diào)用ASP.NET的Webservice來獲取信息.所以這段時(shí)間開始看Webservice，試著通過XmlHttpRequest調(diào)用Webservice，過程中碰到不少問題，也有不少的收獲
2012-07-07
JavaScript超詳細(xì)實(shí)現(xiàn)網(wǎng)頁輪播圖
這篇文章主要介紹了JavaScript超詳細(xì)實(shí)現(xiàn)網(wǎng)頁輪播圖,我們經(jīng)常會看到各種輪播圖的效果，它們到底是怎樣實(shí)現(xiàn)的呢？今天我們就一起來看一下具體實(shí)現(xiàn)方法吧
2021-12-12
js實(shí)現(xiàn)多個(gè)標(biāo)題吸頂效果
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)多個(gè)標(biāo)題吸頂效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-01-01