window. Open different source pages to communicate and transfer data


Personal website

  1. Parent page open child page
  2. The child page sends a message to the parent page to notify that the page loading is complete
  3. The parent page sends data to the child page after receiving the loading completion of the child page

Code example:
Parent page

const targetWindow = window. Open ("sub page address", "_black");
window.addEventListener("message", e => {
  If (e.origin = = "sub page address"){
    console. Log (, "data sent from sub page");
    targetWindow. PostMessage ("data sent to sub pages", "*");


window.addEventListener('message',e => {
  console. Log (, 'data sent from parent page');
window.addEventListener('load',() =>{
  window. opener. PostMessage ('sub page loading completed ');

Recommended Today

Vue2 technology finishing 3 – Advanced chapter – update completed

3. Advanced chapter preface Links to basic chapters: Link to component development: 3.1. Custom events of components 3.1.1. Binding custom events There are two implementation methods here: one is to use v-on with vuecomponent$ Emit implementation [PS: this method is a little similar to passing from child to parent]; The other is to use ref […]