jquery parent page method

jQuery is a very popular JavaScript library that is widely used in web development. During the development process, we often encounter the need to call methods in the child page in the parent page or call methods in the parent page in the child page. In this article, we will explore how to implement these features in jQuery.

1. Call the method in the parent page in the child page

To call the method in the parent page in the child page, we need to use the parent object. The parent object points to the parent window that contains the current window. In jQuery, you can use parent.$() to obtain the jQuery object in the parent window, and then call methods in the parent window.

For example, suppose a method named showMessage is defined in the parent page:

function showMessage(){
    alert('Hello World!');
}

How to call this method in the child page? The code is as follows:

parent.$().showMessage();

The parent.$() here obtains the jQuery object in the parent window, and then calls the showMessage method in the parent window. It should be noted that if the method in the parent page needs to receive parameters, the corresponding parameters also need to be passed when calling.

2. Call the method in the subpage in the parent page

To call the method in the subpage in the parent page, we need to use the iframe object. The iframe object points to a subpage contained in the current page. In jQuery, you can use $('iframe') to get the jQuery object in the child window, and then call the method in the child window.

For example, suppose a method named showMessage is defined in the child page:

function showMessage(){
    alert('Hello World!');
}

How to call this method in the parent page? The code is as follows:

$('iframe')[0].contentWindow.showMessage();

The $('iframe') here gets the jQuery object in the sub-window, then gets the first iframe element through [0], and then gets the window of the sub-window through contentWindow Object, and finally call the showMessage method in the window. It should be noted that if the method in the subpage needs to receive parameters, the corresponding parameters also need to be passed when calling.

In addition to using the above methods, you can also use the postMessage API to implement communication between the parent page and the child page, but this is another topic and will not be discussed here.

Summary

The above is how to implement the method of parent page calling child page or child page calling parent page in jQuery. It should be noted that when accessing across domains, protocols or ports, there may be some restrictions and corresponding settings need to be made. At the same time, in order to ensure the maintainability and readability of the code, it is recommended to give each method a meaningful name when writing code and avoid using anonymous functions as much as possible.

The above is the detailed content of jquery parent page method. For more information, please follow other related articles on the PHP Chinese website!