The examples in this article describe a way to pass data between JavaScript browser windows. Share to everyone for your reference. The specific analysis is as follows:
Summary:
In the project development we often encounter the window, some through the div simulation window effect, some through the IFRAME, but also through the window with the open function opened a new window. The last one to share today is to open the page for data interaction through the window.open () function. First look at the effect chart:
Principle:
The parent window passes data to the child window passed through the parameters of the URL, and the child window passes the data to the parent window through the parent window's global function.
Code:
index.html is as follows:
Copy Code code as follows:
<! DOCTYPE html>
<meta charset= "UTF-8" >
<title>Document</title>
<body>
<div id= "Content" ></div>
<button id= "Test" > button </button>
<script>
var test = document.getElementById (' test ');
Test.onclick = function () {
window.open ('./window.html?param1=name¶m2=password ', ' _blank ', ' width=960,height=650,menubar=no,toolbar= No,location=no,directories=no,status=no,scrollbars=yes,resizable=yes ');
};
Window.getcontent = function (tx) {
document.getElementById (' content '). innertext = TX;
}
</script>
</body>
Window.html is as follows:
Copy Code code as follows:
<! DOCTYPE html>
<meta charset= "UTF-8" >
<title>Document</title>
<body>
<div id= "Content" ></div>
<select name= "" id= "City" >
<option value= "Shanghai" > Shanghai </option>
<option value= "Hangzhou" > Hangzhou </option>
</select>
<script>
var params = location.href.substring (Location.href.lastIndexOf ('? ') +1). Split (' & ');
document.getElementById (' content '). innertext = params;
var city = document.getElementById (' city ');
City.onchange = function () {
Window.opener.getContent (City.value);
}
</script>
</body>
Note: There needs to be a service environment running here
I hope this article will help you with your JavaScript programming.