js實現父視窗和子視窗傳遞資料
阿新 • • 發佈:2018-12-20
js實現父視窗和子視窗傳遞資料
1.test.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>父視窗</title>
<script>
function son(){//開啟子視窗
s=window.open("son.html")
}
function close_son(){//關閉子視窗
if(s){
s.close();
s=null;
}
}
</script>
</head>
<body>
<textarea id="text"></textarea><br>
<input type="button" value="開啟子視窗" onclick="son()"><br>
<input type="button" value="關閉子視窗" onclick="close_son()">
</body>
</html>
2.son.html
<!DOCTYPE html>
<html>
<head>
<meta charset= "UTF-8">
<title>子視窗</title>
<script>
function request(){
var t=document.getElementById('input1').value;//獲取id為input1的值
window.opener.document.getElementById('text').innerHTML=t;//使父窗口裡id為text的區域顯示t的值
}
</script>
</head>
<body>
<input type="text" id="input1"> <br>
<input type="button" value="提交資料" onclick="request()"><br>
</body>
</html>
建立子視窗的方法
- 直接內嵌於標籤內(不通過js實現)
<input type="text" id="" value="" onclick="new=open("son.html","sm","")">
關閉子視窗的方法
<input type="text" onclick="new.close()">
關於js中一些方法的理解
- document.getElementById(“id”)的到是一個object(物件),需要得到值還需要使用.value,相關的方法請學習W3C
初學如有錯誤希望指出