Method of calling JS in the Neutron parent class window of IFRAME and matters needing attention _javascript skill

First, the preface

My page uses the Easyui pop-up window to embed an IFRAME inside.

First: The parent window opens a child window is a new user information of the IFRAME page, click Save, the child window IFrame to invoke the parent window function Closeaddwindow () method, let the parent window to close the new page;

Second: The parent window opens an IFRAME child window that sets the user's permissions, first opening the child window will load all the existing permissions in the database table, and then the child window needs to append the loaded permission information into an ID <table id= "TB" > </table>, there is a problem here is that the parent window opens the child window after loading all the permissions can not append HTML to the id= "TB" table, the reason is very simple, because the parent window after the child window load all permissions information, no table elements found, Because the child page has not been fully loaded, this situation is also described here, to the IFRAME register a onload event, and so on after the completion of the load to call the additional method.

OK, simple to here, let's see more examples!! ~~~~~~ (*^__^*) Hee ...

Two, the IFRAME Child parent window method call

2.1 Syntax use

1, the parent window embedded in the IFRAME

Copy Code code as follows:

<iframe id= ' myframe ' name= "MyFrame" src= "fchild.html" width= ' 100% ' ' height= ', ' 100% ' frameborder= ' 0 ' ></iframe >

2, the parent window calls the child window method

Copy Code code as follows:

MyFrame.window.sonMethod ();

3, child window calls the parent window method

Copy Code code as follows:

Parent.fathermethod ();

4, compatible with the browser's iframe load completion method

 if (myframe.attachevent) {
      myframe.attachevent ("onload", function () {
        alert ("Load method compatible with IE loading");
      }
    else {
      myframe.onload = function () {
        alert ("Compatible with other browser loading methods");}
    

2.2 Syntax Code

Father.html

 <! DOCTYPE html> 
 

Fchild.html

<! DOCTYPE html>
 
 

Third, under what circumstances use to Myframe.onload or myframe.attachevent

this uses the EASYUI framework front end frame

<div id= "Divroleusers" title= "Set User Role" class= "Easyui-window" closed= "true" collapsible= "false" minimizable= "false" Maximizable= "false" style= "width:140px; height:250px; padding:5px; " > </div> <div > <input type= "button" id= "BTN" value= "Set user Role"/></div> <script type= "Te
    Xt/javascript "> $ (" #btn "). Click (function () {Showsetuserrolewindow ();});
      Set User Role function Showsetuserrolewindow () {var getselections = $ ("#tt"). DataGrid ("Getselections");
        if (Getselections.length > 1 | | getselections.length = 0) {$.messager.alert ("Error Prompt", "Please select a row of data!", "errors");
      return false; var data = getselections[0];
      Gets the data//if ($ ("#divRoleUsers #iframe") for all JSON in the selected row. Length!= 0) {//$ ("#divRoleUsers #iframe"). Remove (); }//$ (' #divRoleUsers '). Append ("<iframe id= ' iframe ' name= ' iframe ' src= ' roleusers_update.aspx?") Userid= "+ data. UserID + "' width= ' 100% ' height= ' 100% ' frameborder= ' 0 ' &GT;&LT;/iframe> "); Wrong way! : Above src= ' roleusers_update.aspx? Userid= "+ data. UserID + "' Here through the mosaic parameter iframe of SRC,//Then through the Sub window Parent.document.getElementById (" iframe "). getattribute (" src ");//Get parent form Ifra   The src discovery of me is null because of the UserID value, but also because of the sequence of loading, which leads me to use the IFRAME registration onload event to get the result I need//if (myframe.attachevent) {//
      Myframe.attachevent ("onload", function () {//alert ("Local iframe are now loaded.");
      Myframe.window.loadAllRole ();
      //  });
      else {//myframe.onload = function () {//alert ("Local iframe are now loaded.");
      Myframe.window.loadAllRole ();
      //  }; if ($ ("#divRoleUsers #myframe"). Length!= 0) {//This step is necessary!!!
        , because without this sentence the OnLoad binding event only executes once, and I need a way to call the child window once every time the IFRAME is loaded!
      $ ("#divRoleUsers #myframe"). Remove (); } $ (' #divRoleUsers '). Append ("<iframe id= ' myframe ' name= ' myframe ' ' src= ', ' roleusers_update.aspx ' width= ', ' 100% ')" height= "
      ' 100% ' frameborder= ' 0 ' ></iframe> '); if (MyframE.attachevent) {myframe.attachevent ("onload", function () {myframe.window.loadAllRole (); Myframe.window.loadUserRole (data.
        UserID);
      });     else {myframe.onload = function () {myframe.window.loadAllRole (); The method inside the sub window iframe is invoked to load all the role checkbox myframe.window.loadUserRole (data.   UserID);
      Then pass the user ID past to the child window method, to the user Owned role set checkbox check};
    } $ (' #divRoleUsers '). Window (' open '); } </script>

Four, summarize a few key points

Parent-child window method call, pay attention to the sequence of loading to get the desired results, encounter problems commonly used alter () test or browser developer tool monitoring

The above content is in this article introduces the IFRAME Neutron parent class window to call JS the method and the attention matter, hoped everybody likes.