บทความนี้อธิบายวิธีการส่งข้อมูลระหว่างหน้าต่างเบราว์เซอร์ JavaScript แบ่งปันสำหรับการอ้างอิงของคุณ การวิเคราะห์เฉพาะมีดังนี้:
สรุป:
ในการพัฒนาโครงการเรามักจะพบกับหน้าต่างป๊อปอัพ บางคนใช้ div เพื่อจำลองเอฟเฟกต์ป๊อปอัพบางส่วนใช้ iframes และบางคนใช้ Windows เพื่อเปิดหน้าต่างใหม่ผ่านฟังก์ชั่นเปิดที่มาพร้อมกับหน้าต่าง วันนี้ฉันจะแบ่งปันการโต้ตอบข้อมูลประเภทสุดท้ายกับคุณผ่านฟังก์ชั่น window.open () กับคุณ ก่อนอื่นดูการเรนเดอร์:
หลักการ:
ข้อมูลที่ส่งผ่านไปยังหน้าต่างเด็กโดยหน้าต่างหลักจะถูกส่งผ่านพารามิเตอร์ของ URL และข้อมูลที่ส่งผ่านไปยังหน้าต่างเด็กโดยหน้าต่างพาเรนต์จะถูกส่งผ่านฟังก์ชั่นทั่วโลกของหน้าต่างหลัก
รหัส:
index.html มีดังนี้:
คัดลอกรหัสดังต่อไปนี้: <! doctype html>
<html lang = "en">
<head>
<meta charset = "utf-8">
<title> เอกสาร </title>
</head>
<body>
<div id = "เนื้อหา"> </div>
<button id = "test"> ปุ่ม </button>
<script>
var test = document.getElementById ('ทดสอบ');
test.onclick = function () {
window.open ('./ window.html? param1 = name¶m2 = รหัสผ่าน', '_blank', 'width = 960, ความสูง = 650, menubar = ไม่, แถบเครื่องมือ = ไม่, ตำแหน่ง = ไม่, ไดเรกทอรี = ไม่, สถานะ = ไม่, scrollbars = ใช่, resizable = ใช่');
-
window.getContent = function (tx) {
document.getElementById ('เนื้อหา'). innerText = tx;
-
</script>
</body>
</html>
window.html มีดังนี้:
คัดลอกรหัสดังต่อไปนี้: <! doctype html>
<html lang = "en">
<head>
<meta charset = "utf-8">
<title> เอกสาร </title>
</head>
<body>
<div id = "เนื้อหา"> </div>
<select name = "" id = "city">
<ตัวเลือกค่า = "เซี่ยงไฮ้"> เซี่ยงไฮ้ </potion>
<ตัวเลือกค่า = "หางโจว"> หางโจว </potion>
</เลือก>
<script>
var params = location.href.substring (location.href.lastindexof ('?')+1) .split ('&');
document.getElementById ('เนื้อหา'). innerText = params;
var city = document.getElementById ('เมือง');
city.onchange = function () {
window.opener.getContent (City.Value);
-
</script>
</body>
</html>
หมายเหตุ: มีสภาพแวดล้อมการบริการที่จะทำงานที่นี่
ฉันหวังว่าบทความนี้จะเป็นประโยชน์กับการเขียนโปรแกรม JavaScript ของทุกคน